Question

我有两个div并且我试图让它们都坐在顶部以便彼此相邻，但第二个带有虚拟文本的是因为某种原因在页面的中间位置，我不能让它像顶部一样第一个div。这是我的一些代码

<div id="bgdsply2" style="width:300px; display:inline-block;">
        <img src="admin/showroom/clocks/thumbnails/bru4.jpg" width="300px" height="800px" alt="" />
    </div>
    <div style="width:300px; margin-left:200px; display:inline-block;">
        Quo ne facer impedit euripidis, inermis nonumes vis ex, fabulas menandri postulant ad nam. Animal disputationi ad qui, case natum cotidieque ei mel, et diam prima posse vel. Usu admodum lobortis inciderint eu, oratio tritani et vis, ea eum nemore deseruisse. Dicam conceptam interpretaris sed ea. Ex mei everti abhorreant disputationi.
    </div>

Answer 1

检查包含div的宽度，并确保它可以支持并排堆叠的div。有些人更喜欢在两个div上添加clear: both;，在末尾添加<div class='container' style='width: 600px;'> <div class='right' style='float: right; display: inline-block; width: 300px; margin: 0px; padding: 0px;'> // content </div> <div class='left' style='float: right; display: inline-block; width: 300px; margin: 0px; padding: 0px;'> // content </div> <p style='clear: both;'></p> </div>标记，这样单个空格不会将div宽度增加到600px以上;

$('.allcommentsof<%= @Comment.post.id %>').html("<%= j render('comment', id: @Comment.post.id) %>");

Answer 2

将div放在彼此旁边，没有空格或输入中间。你有两个固定宽度的div，（我假设）意图完全填充父元素的宽度。 div之间的空间使得它们有点太宽而不能彼此相邻。

<div id="bgdsply2" style="width:300px; display:inline-block;">
    <img src="admin/showroom/clocks/thumbnails/bru4.jpg" width="300px" height="800px" alt="" />
</div><div style="width:300px; margin-left:200px; display:inline-block;">
    Quo ne facer 
</div>

我的div处于错误的垂直位置

2 个答案: