0

ページにこのレスポンシブレイアウトがあります。は<aside>一定の幅で、.main領域には がありmargin-rightます。.mainこれを行うのは、エリアをさまざまなデバイスに適応させながら、<aside>一定のままにしたいからです。

http://jsfiddle.net/c6mZN/1/

ご覧のとおり、問題は、メイン領域内に clearfix も使用するオブジェクトのリストがあり、最初の要素がサイドバーの最後までオブジェクトをクリアすることです。私が欲しいのは、それが残りの部分とまったく同じように見えることです.block

どうすればこれを達成できますか？

4

1 に答える 1

1

固定コードでフィドルをフォークしました。

.main要素は、子が外部レイアウトフローを無視できるように、別個の「フォーマットコンテキスト」を持っていることを知る必要があります。標準に準拠したブラウザでこれを行う唯一の方法は、次の方法ですoverflow: hidden。

.main {
    overflow: hidden;
}

ちなみに、マージンを取り除くと、.main残りのスペースが自動的に占有されます（したがって、必要に応じて幅を変更したり、aside列を追加したりすることもできます）—次にaside margin-left: 10px、ギャップを指定するように指定しましたレイアウトを一定に保つ必要があります。

于 2013-03-13T14:57:50.403 に答える