css - 表示中ブロック内の要素が正しく

Question

みんな！ブロック内の p 要素を表示する方法を知りたい

私はコードを持っています: jsFiddleで、子ブロックの底の後でも HTML がそれを表示する理由がわかりませんか? 他の要素の近くを左に移動する必要がありますが、足に移動し​​ます。修正方法は？

私の悪い英語で申し訳ありませんが、理解して助けていただければ幸いです。

• 赤枠はデバッグ専用です。

Answer 1

インラインブロックについて考えていますか？表示ブロックは、デフォルトで p タグが行うことです。

Answer 2

あなたの質問が正しいかどうかわかりません。すべてのタグを 1 行に入れようとしている場合は、このデモを試してください。

  div#content div.layout a{
   display: block;
   width: 50px;
   height: 50px;
   border: 1px solid red;
   float:left;
  }

Answer 3

列とインライン ブロックを一緒に使用してみてください。

http://jsfiddle.net/qZnBE/13

div#content {
    background: rgba(0, 0, 0, 0.47);
    width: 400px;
    height: 200px;
    margin: 0 auto;
}
div#content div.layout {
    columns:5px 4;
    -webkit-columns:5px 4;
    /* Safari and Chrome */
    -moz-columns:5px 4;
    /* Firefox */
    width: 390px;
    height: 190px;
    margin: 0 auto;
    border: 1px solid red;
    float: left;
}
div#content div.layout p {
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 1px solid red;
    margin: 0;
}

<div id="content">
    <div class="layout">
        <p>one</p>
        <p>two</p>
        <p>three</p>
        <p>four</p>
        <p>five</p>
    </div>
</div>

IE < 10 は CSS 列をサポートしていないことに注意してください。http://caniuse.com/multicolumn