需要两个div才能正确排列

问题描述：

Here is a screenshot of how both div's lineup。需要两个div才能正确排列

左列是，我要排队到它的右边的DIV是

而且这两个div的是内

.content-body { 
    padding:10px 15px; 
    font-size:.8em; 
    font-family:arial; 
    overflow:auto; 
} 

.col-left { 
    float:left; 
    position:relative; 
    overflow:auto; 
    height:100%; 
    width:20%; 
    padding:0 5px 0 0; 
} 

.col-middle { 
    width:auto; 
    height:auto; 
    float:left; 
    xmargin-top:5px; 
    xfont-size:.8em; 
    border:1px solid red; 
    font-family:arial; 
}

我该如何获得.COL中等DIV正确排队？

任何帮助表示赞赏。

答

更改宽度.col-middle至80％或更低因此两个div都可以放入其容器内。

您还可以制作.col-middle float right。

答

添加

clear:none;

双方你列的div

和

width:80%;

你的中间一列应该使他们并排:)

答

另一个去边选项（尽管你真的应该给右栏一个宽度）：

.col-middle { 
     ... 
     margin-left: 20%; 
    }

编辑：如果你给.COL中等左边界，there's无需浮动，或给它的宽度

答

COL-中间走的是宽度：100％所以你必须提供宽度：小于80％。

你可以做的另一个解决方案是使宽度：79％，并删除float：left并使其显示：table-cell;

.col-middle { 
    width: 79% 
    height:auto; 
    display: table-cell; 
    xmargin-top:5px; 
    xfont-size:.8em; 
    border:1px solid red; 
    font-family:arial; 
}

需要两个div才能正确排列

相关推荐