1

このフィドルが私が望むものを説明できることを願っています。3 つの列 (左に 1 つ、右に 1 つ、中央に 1 つ (CSS で flot を設定せずに) を配置) のレイアウトがある場合、レイアウトは完璧です! しかし、CSS で float を設定して中央のスペースにいくつかの要素を追加したい場合、「clear:left;」を設定すると、左の列のコンテンツの最後に新しい要素が表示されます...それは迷惑な結果です!

しかし、私のフィドルを見ると、私が何を望んでいるかをよりよく理解できます。

4

2 に答える 2

2

私があなたを正しく理解していれば、 で中央に要素を追加することはできませんclear:left;。そうする理由はありません。すべての要素を指定しdisplay: inline-block;vertical-align:top;て、そのようにhtmlを設定します。それらは左に 1 つ、右に 1 つ、最後に中央にあり、不要な要素になります。

<div class="width:200px;/* you can set if you want */">fist elem</div>
<div>content</div>
<div>some elements</div>
<div class="width:200px;/* you can set if you want */">last elem</div>
于 2012-08-11T07:05:07.120 に答える
1

width、min-width、max-width css 属性を慎重に使用し、position:relative と display:block には十分注意してください。

上記の css 属性を使用した最後にマージンを使用し、ボーダーなしの css では機能しません cssすべての初心者向けにこれを書き続けていますが、css でそのルールを決して忘れないでください。要素に境界線を追加しないと、どこからデザインが壊れ始めるかを確認してください。

また、float を使用するときに覚えておくべきもう 1 つのポイントは、float 要素の高さが同じであることを確認することです。

|  |
|  |    | |

これらの各 div (高さ 100px の左と 50px の右) が右にフロートされると、右の div が左の div の下に来ます。

于 2012-08-11T15:57:33.620 に答える