[英]DIVs position (xhtml / css)
I have - I think - a very simple problem 我有-我认为-一个非常简单的问题
I want to align 4 different DIVs like that : 我想像这样对齐4个不同的DIV:
AAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAA
BBBBBBBBBB CCCCCCCCCCCC
BBBBBBBBBB CCCCCCCCCCCC
BBBBBBBBBB CCCCCCCCCCCC
CCCCCCCCCCCC
CCCCCCCCCCCC
DDDDDDDDDDDDDDDDDDDDDDD
DDDDDDDDDDDDDDDDDDDDDDD
DDDDDDDDDDDDDDDDDDDDDDD
The 4 DIVs are text only, with variable length 4个DIV仅是文本,长度可变
C is a "float: right;" C是“浮点数:正确;” DIV
DIV
To be sure to avoid overlap between C and D, D has a "clear: both;" 为了确保避免C和D重叠,D具有“明确:两者皆有”的含义。 instruction.
指令。
My problem : I have a big empty space at the top of D, like that : 我的问题:在D的顶部有一个很大的空白空间,就像这样:
AAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAA
BBBBBBBBBB CCCCCCCCCCCC
BBBBBBBBBB CCCCCCCCCCCC
BBBBBBBBBB CCCCCCCCCCCC
CCCCCCCCCCCC
CCCCCCCCCCCC
DDDDDDDDDDDDDDDDDDDDDDD
DDDDDDDDDDDDDDDDDDDDDDD
DDDDDDDDDDDDDDDDDDDDDDD
and I do not understand why... someone can help me? 我不明白为什么...有人可以帮助我?
BTW, if I do not put the "clear: both;" 顺便说一句,如果我不说“清楚:两者;”; instruction in the D DIV, I have an overlap :
D DIV中的指令,我有一个重叠部分:
AAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAA
BBBBBBBBBB CCCCCCCCCCCC
BBBBBBBBBB CCCCCCCCCCCC
BBBBBBBBBB CCCCCCCCCCCC
DDDDDDDDDD CCCCCCCCCCCC
DDDDDDDDDD CCCCCCCCCCCC
DDDDDDDDDDDDDDDDDDDDDDD
DDDDDDDDDDDDDDDDDDDDDDD
My CSS is pretty simple : 我的CSS很简单:
.A {
width: 200px;
}
.B {
width: 100px;
}
.C {
width: 100px;
float: right;
}
.D {
clear: both;
width: 200px;
}
How is this (ASCII and all) 怎么样(ASCII和所有)
http://jsfiddle.net/Mutant_Tractor/9z3ru/1/ http://jsfiddle.net/Mutant_Tractor/9z3ru/1/
#wrap {
width:200px;
}
#as {
width:200px;;
clear:both;
}
#bs {
width:100px;
float:left;
}
#cs {
width:100px;
float:right;
}
#ds {
clear:both;
}
Slight change to how Myles did it. 迈尔斯的做法略有变化。 With the div with A's in it being full length as well.
带有A的div也为全长。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.