Question

我有以下HTML代码。它在div中使用一个H标签时有效。我在一个div中插入另一个H标签的那一刻，该div似乎打破了其余部分的代码。我使用内联块，所以div正确对齐。 div与额外的H标签向下推动另外两个div并且对齐消失了。

BTW，所有边距都设置为0，所以这不是问题。此外，将H标记设置为内联元素也无济于事。

任何帮助表示赞赏！提前谢谢。

   #content-2 {
     width:980px;
     margin:0 auto;
    }
    #content-2 div {
     display:inline-block;
     height:400px;
     width:33%;
    }


    <div id="content-2">

    <div>
    <h3>Bla</h3>
    <h3>Bla</h3>
    </div>

    <div>
    <h3>Bla</h3>
    </div>

    <div>
    <h3>Bla</h3>
    </div>

    </div>

Answer 1

嗯，我不确定导致其他div被推倒的原因。它发生在<p>或<span>而不是<h3>的情况下，所以它不仅仅是标题。

将<div>放在#content-2 float:left内似乎可以解决问题，这对您有用吗？

Answer 2

浮动div或使用vertical-align: top;

Answer 3

使用float:left然后执行inline block

多个h标签打破了div

3 个答案: