Trung tâm cá nhân
sách gpt4 ai đã đi

html - 外部 DIV 不收缩包装

In lại 作者：行者123 更新时间：2023-11-28 08:00:11 26 4
mua khóa gpt4 Nike

我有显示内联 block 等，但此标记中的 htmlDiv div 的行为与我预期的不同。它的行为就好像内部 div 彼此相邻，即使它们不相邻也是如此。如何解决这个问题？

如果不清楚，请运行动画片段...

nhập mô tả hình ảnh ở đây

nhập mô tả hình ảnh ở đây

nhập mô tả hình ảnh ở đây

nhập mô tả hình ảnh ở đây 

var demoContainer = d3.select('#demoContainer').style('width', '100px')
    function tick() {
      demoContainer.transition().duration(4000).style('width', '400px')
      .transition().duration(4000).style('width', '600px')
      .transition().duration(3000).style('width', '400px')
      .transition().duration(3000).style('width', '100px')
      .each('end', tick);
    };
    tick();
#htmlDiv {
      font-family: 'Helvetica Neue', Helvetica, 'Segoe UI', Arial, freesans, sans-serif;
  cỡ chữ: 12px;    
  outline: solid 1px black;
      background-color: rgba(0, 0, 0, 0.25);
      hiển thị: khối nội tuyến;
      vị trí: tương đối;
    }

    .container {
      height: auto;
      width: 100%;
      hiển thị: khối nội tuyến;
      vị trí: tương đối;
    }

    .bubbles,
    .subBubbles,
    .span {
      color: #ccc;
    }

    .select-bubbles,
    .bubbles {
      padding: 5px;
      margin: 3px;
      outline: solid 1px white;
      background-color: rgb(114, 114, 114);
      width: 150px;
      hiển thị: khối nội tuyến;
    }


    

      I want this outer div to shrink-wrap the 4 inner divs regardless of width... 

      

        

          
            
            
          
          

            
                
                
              
            
          

        

      
 

      

        bubble1
        

          sub1
          
            
              sub1
             subsub1
          
          subsub2
        

        

          
            sub2
          
          
            
              sub2
            
            subsub1
          
        

      

      

        bubble2
        

          sub1
          subsub1
          subsub2
        

        

          sub2
          subsub1
          subsub2
        

          sub3
          
            subsub1
          
          
            subsub2
          
        

      

      

        bubble2
        

          sub1
          subsub1
          subsub2
        

        

          sub2
          subsub1
          subsub2
        

          sub3
          
            subsub1
          
          
            subsub2

1 Câu trả lời

你的问题是你在下面的代码中将宽度设置为 250px 

.select-bubbles, .bubbles {
     padding: 5px;
  margin: 3px;
  outline: solid 1px white;
  background-color: rgb(114, 114, 114);
  /* width: 250px; */
  /* display: inline-block; */
 }

移除内联 block 并将宽度设置为 250px，这会导致您的框不会收缩小于 250px。

我们暂时删除了内联 block ，如果您愿意，可以添加更多属性以使其看起来更好。

关于html - 外部 DIV 不收缩包装，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29822426/

26 4 0
Bài viết được đề xuất: javascript - document.querySelector ("foreignObject") 在 Chrome 中为 null
Bài viết được đề xuất: c++ - 如何从 C++ OCX 模块导出自定义类型名称？
Bài viết được đề xuất: javascript - 使用原型(prototype)调用不同的函数来启动和停止进程
Bài viết được đề xuất: ios - 从分离的 UITableView 推送/呈现 ViewController
行者123
Hồ sơ cá nhân

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá Didi Taxi miễn phí
Mã giảm giá Didi Taxi
Các bài viết nóng hổi trên toàn bộ trang web
Giấy chứng nhận ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com