私が取り組んでいるページには、画像が変化するアニメーション (CSS を使用) を含む div があり、その下にはコンテンツのラッパー div があります。
<div id="animation">
<img ...>
...
<img ...>
</div>
<div id="content">
Some content
</div>
フロート、クリア、位置など、さまざまな方法を試しましたが、コンテンツ div をアニメーション div の下の本来の場所にとどめることはできません。オーバーラップしています。部分的に機能することがわかった唯一の解決策は、最初のdivに画像の高さを与えることです（幅と高さはすべて同じです）が、そうすると、異なる解像度で壊れるか、画像の高さが100％になり、上記を適用しますが、画像はさまざまな解像度で信じられないほど醜く見えます.
できればCSSのみを使用して、どうすれば目標を達成できますか?
編集：JSFiddle
編集 2:画像の変更にこのチュートリアルを使用しました。