CSS相对浮点数

前端之家收集整理的这篇文章主要介绍了CSS相对浮点数前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有3个div排队中心div有许多位置:绝对图像(重叠 – 一个图像一次可见;其余的显示:无;对于jQuery交叉渐变,这不是一致的).

我将中心div改为位置:相对于使其子图像成为position:absolute.但是,如果我将左,中,右div设置为float:left,则不按顺序显示:left,center,right div(左和右组合在左侧).

如果我取消位置:相对于中心的div,它是有效的(但当然,这些图像不能绝对定位在父div中).

我如何定位这些div,以便我已经离开,中心,右边,而图像可以绝对定位在中心位置?我必须为左右的div设置相对位置吗?

解决方法

您可以使用以下CSS为每列.考虑到#div-left和#div-right都必须出现在#div-center之前的 HTML中,否则它们不会在同一个顶部位置.
#div-left {
    float: left;
    width: 100px;
 }

 #div-center {
    margin: 0 100px;
    position: relative;
 }

 #div-right {
    float: right;
    width: 100px;
 }

基本上,左右两侧分别浮动到每侧,固定宽度.然后,中心div被分配一个左边距和右边距,等于在每一边浮动的div的宽度.因为,由于利润率,中心div适合于浮标,它们之间完全一致.

位置:布局不需要相对属性(我刚刚添加它,因为您需要在该div中定位其他对象).

如果您需要完整的布局来确定宽度(例如,您希望页面占用宽度为980px),只需创建一个带宽度的div,并在其中包含三个div.

你可以看到这里的例子:http://jsfiddle.net/7pBVX/

猜你在找的CSS相关文章