一旦它的多个元素变得简单
position:absolute;
bottom:0;
无效,因为它会覆盖多个元素
这是我尝试的一个小提琴:http://jsfiddle.net/7uYUP/ (这是我想要向右和向下浮动的.interaction元素,现在它们只是向右浮动)
我希望不必诉诸JS ..
答案 0 :(得分:2)
问题是绿色和黄色方框之间的高度不同(10pt对40pt)。您可以使用margin-top
:
.interaction{
height:40pt;
width:100pt;
background-color:yellow;
float:right;
border: 1pt solid blue;
margin-top:-32pt;
}
答案 1 :(得分:0)
<body>
<div id="container"><div>
<div class="interaction leftalign">
</div>
<div class="interaction">
</div>
</div></div>
</body>
body{
background-color:red;
}
#container{
position:absolute;
height:10pt;
width:100%;
background-color:green;
bottom:0;
}
#container > div {
position:relative;
height:100%;
}
.interaction{
height:40pt;
width:100pt;
background-color:yellow;
float:right;
border: 1pt solid blue;
}
.interaction.leftalign {
float:left;
}