[英]CSS div float - top to buttom and left to right
我怎样才能把div从上到下和从左到右
示例: http : //jsfiddle.net/ZWxGW/2/
http://jsfiddle.net/ZWxGW/2/
解决方案 http://jsfiddle.net/pMbtk/33/
你可以试试这个...
ul {
width:60px; height: 60px;
}
ul li{
float:left;
width:20px;
list-style:none;
}
ul, ul li {
-moz-transform: rotate(-90deg) scaleX(-1);
-o-transform: rotate(-90deg) scaleX(-1);
-webkit-transform: rotate(-90deg) scaleX(-1);
-ms-transform: rotate(-90deg) scaleX(-1);
transform: rotate(-90deg) scaleX(-1);
/* IE8+ - must be on one line, unfortunately */
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-3.061616997868383e-16, M12=1, M21=1, M22=3.061616997868383e-16, SizingMethod='auto expand')";
/* IE6 and 7 */
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=-3.061616997868383e-16,
M12=1,
M21=1,
M22=3.061616997868383e-16,
SizingMethod='auto expand');
}
.message {
width:90px;
margin:3px;
background-color:#dfdfdf;
float : left;
}
如果从左到右和从上到下都适合您,请尝试此操作。
1)在这种情况下,您必须采用div列(在图像中为红色),并且必须在该div内放置其他div 1,2,3,4 ... 给div以下属性。
.message,.outer_div {
向左飘浮;
高度:自动;
宽度:200像素;
}
2)在另一种情况下,
如果您想从左到右,从上到下,那么您不需要外部div ...以红色指定
从contentDiv移除高度,然后将float:left;
以便包裹您的内容。
我在您的示例中尝试过此操作:
.message {
width:90px;
margin:3px;
background-color:#dfdfdf;
position:absolute;
}
它会有所帮助。
祝好运 !
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.