0

私は次のものを持っています:

XHTML:

<div id="container">
 // contents
</div>

CSS:

#container { margin: 0 auto; width: 940px; overflow: hidden; padding: 10px; border: 1px solid #CCCCCC; }

div はページの中央に配置され、DIV がコンテンツの高さまで自動的に拡張されるようにしますmargin: 0 autooverflow: hidden

ボックスの影がある DIV にいくつかのコンテンツがあります。この問題は、overflow: hidden ルールが原因で、影がページに完全に表示されません。これを回避する唯一の方法は次のとおりです。

  1. オーバーフローを取り出します: 非表示 - しかし、コンテナーの DIV は下に展開されません。
  2. #container で height / min-height を使用しますが、これはサイトのすべてのページでうまく機能しません。
  3. float: left を使用しますが、DIV がページの中央に配置されません。

誰かこれについてもっと提案がありますか?

4

2 に答える 2

2

多くの clearfix 手法のいずれかを使用できます。これにより、トリミングされた を削除overflow:hiddenして修正できますbox-shadow

このトピックに関する最近の記事は次のとおりです: http://css-tricks.com/snippets/css/clear-fix/

于 2012-12-06T22:26:08.427 に答える
0

div のマージンで問題が解決することは確かですが、さらにコードを表示すると、確認が容易になります。

于 2012-12-06T22:24:21.653 に答える