0

HTMLElementラッピングを防ぐための「ベスト」な方法または「ベストプラクティス」とは何ですか?

私は実際にrelative配置された要素について話している。absolute要素を使用して、それらのleft位置をに追加するだけでよいと思いますanotherElement.width

例: http: //jsfiddle.net/YX4cm/

この例ではfloat:leftスタイルを使用していますが、右側に十分なスペースがない場合は新しい要素もラップします。

だからここでの私の質問は:

  • ラッピングを完全に拒否する方法はありますか?
  • もしそうなら、そのためのベストプラクティスは何ですか?
4

3 に答える 3

0

1つの方法は、2つのコンテナーシステムを使用することです。内側のコンテナーは絶対位置に設定されているため、内側の繰り返される要素のスタイルに実際に触れる必要はありません。

フィドル: http: //jsfiddle.net/3kB3D/

HTML:

<div id='container'>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>

CSS:

#container { width: 200px; background: black; height: 50px; padding: 10px; }
ul { position: absolute; }
li { float: left; margin-right: 12px; width: 50px; height: 50px; background: red; }
于 2012-08-28T15:41:07.870 に答える
0

との組み合わせが機能white-space: nowrapしてdisplay: inline-blockいるようです: http://jsfiddle.net/YX4cm/2/

編集:本体にも機能しますhttp://jsfiddle.net/YX4cm/5/

于 2012-08-28T15:40:18.770 に答える
0

このフィドルmin-width:[large value]で示されているように、絶対に配置され、 css プロパティを持つコンテナ要素で要素をラップできます

于 2012-08-28T16:17:20.087 に答える