Question

我试图谷歌这个问题，在一个小提琴中重新制作，奇怪的是对我而言，问题消失了，而我几乎复制了所有代码（解释了jquery链接等因为FIDDLE中不需要这些）。

我很想知道是否有人可以告诉我为什么我的内联块元素，当给出一个高度，宽度，边距和填充不能完全浮动在彼此旁边但是在第一个之后的那种身份？

链接; http://eightytwenty.nl/blogindex.html＆lt; - 无效，相同代码

Date

<div class="surroundContainer">
<div class="hPage firstPost">
    <section><article>
    <h1>First post,for Joey</h1>
    </article></section>
</div>
<div class="hPage">
    <section><article>
    <p>Way too scary for me.</p>
    </article></section>
</div>
<div class="hPage">
    <section><article>
    <p>Way too scary for me.</p>
    </article></section>
</div>
<div class="hPage">
    <section><article>
    <p>Way too scary for me.</p>
    </article></section>
</div>

Answer 1

如果你对每个div之间的空格有问题并且你不想使用浮点数，那么你需要清除你的html中的空白区域（比如新行），你可以在两端之间使用注释一个div：

<div class="hPage firstPost">
    <section><article>
    <h1>First post,for Joey</h1>
    </article></section>
</div><!--
--><div class="hPage">
    <section><article>
    <p>Way too scary for me.</p>
    </article></section>
</div><!--
--><div class="hPage">
    <section><article>
    <p>Way too scary for me.</p>
    </article></section>
</div><!--
--><div class="hPage">
    <section><article>
    <p>Way too scary for me.</p>
    </article></section>
</div>

请参阅here以供参考。

Answer 2

使用vertical-align：top;

修复它

显示：内联块定位动作奇怪

2 个答案: