Question

是否可以将固定宽度div与可变宽度div一起浮动？

我希望将80px图像放在div旁边，使用动态内容延伸到提醒宽度的100％ - html将是下面的重复版本 -

例如 -

    <div class="mediaImg">
       <img src="#"/>
    </div>
    <div class="textArea">
    blah blah blah
    </div>

由于保罗

Answer 1

只需在固定div上应用float和width：

div.fixed{
    float: left;
    width: 70px;
    padding: 0 5px;
}

实例：http://jsfiddle.net/nvgBm/

Answer 2

你必须像

一样写

#divleft
{
    background-color:red;
    width:80px;
    height:80px;
    float:left;
}

#divright
{
    background-color:blue;   
    overflow:hidden;
    height:80px;
}

在此示例中，您将padding & margin提交给#divright。布局结构没有效果。

检查此http://jsfiddle.net/sandeep/u2sQD/1/

Answer 3

是。我会把它们放在一个容器类型div中，其位置为：absolute，然后两个div具有相对定位并且浮动左边。

<div class='container' width='100%'>
    <div class='imgDiv'>
         <img src='...'></img>
    </div>
    <div class='content'>

       ...content goes here

    </div>
</div>

然后是css ......

    .container{
          position:absolute
          width:100%
          height:100%

            }
     .imgDiv{

        position:relative
        float:left
        width:80px
         }
      .content{
        position:relative
        float:left

        }

固定宽度Div和可扩展浮动并排？

3 个答案: