我有一个父 div 和 2 个子 div。我希望 [child 2] 以父母为中心。我希望 [child 1] 挂在父母的左侧。如果我给 [child 1] 一个绝对位置,我可以让孩子左挂在容器外。但是,[child 2] 仍然垂直位移 [child 1] 的高度。
[c1][ [c2] ]
我已经在这个jsFiddle中编写了一个示例。任何见解都值得赞赏。
谢谢蒂姆
您的.slide-left-overhang
(这是孩子 1,对吗?)有position: relative
. 设置它position: absolute
,它就不会再干扰了。
其他注意事项:
.slide-container-content
宽度大于其包含元素 - 将其设置为 100% 或您希望文本的任何宽度,然后设置您的边距自动。
你在一个里面设置了一堆<p>
标签<h4>
——我不确定你打算用它做什么,但它在语义上很麻烦。
在这里,请参阅我的更新(细微调整):http: //jsfiddle.net/Ye5us/
使用这个结构:
HTML
<div class="div_container">
<div class="div_left">
</div>
<div class="div_right">
<div class="div_right_content">
</div>
</div>
</div>
CSS
div {
position: relative;
height: 200px;
background: yellow;
}
.div_container {
width: 500px;
margin: 0px auto;
}
.div_left {
width: 200px;
float: left;
}
.div_right {
width: 300px;
float: right;
background: blue;
}
.div_right_content {
margin: 0px auto;
width: 100px;
background: red;
}
jsFiddle:http: //jsfiddle.net/Xk7fP/1/