-1

2 つの列 div があり、2 番目の div に大きな背景を適用し、background-position で左にシフトしています。負のマージンやその他の面白いビジネスの使用を避けながら、全体が表示されたままになり、最初の div の下に隠れないようにしたいと思います。オーバーフローのために隠されるようになりました：もちろんhidden..何かアイデアはありますか？

http://tinkerbin.com/UqYLFKZGの例を次に示します。

コードは次のとおりです。

HTML:

<div class="left">
<ul>
  <li>one item</li>
  <li>one item</li>
  <li>one item</li>
  </ul>
</div>
<div class="middle">
<ul>
  <li>one item</li>
  <li>one item</li>
  <li>one item</li>
  </ul>
</div>

CSS

.left {float:left;width:100px;}
.middle {overflow:hidden;background:url("http://farm8.staticflickr.com/7116/8163983721_1ed2414765_b.jpg") no-repeat;background-position:-400px -200px;}

編集：反対票に少し驚いた。実際、overflow:hidden を削除したときに、左側がドキュメントの通常のフローになかったため、中央のコンテンツが左側のコンテンツと重なっていたため、質問に答えるのが簡単すぎるようです。したがって、追加する必要がありました。これを修正するための左マージンまたはパディング。

4

1 に答える 1

0

解決策は、overflow:hidden を削除し、.middle を正しく配置するために、.left div のサイズに等しい margin-left または padding left を追加することです。

于 2012-11-08T21:00:51.257 に答える