サイズの異なるコンテンツのdivを作成できるようにしたいので、それは一種の解決策です
編集： 今私が必要としているのは、これらのdivが同じように動作している間、このように相互作用しないようにする方法です
まず、画像：
そして今、いくつかのコード:
したがって、この CSS を使用して隣り合わせに配置された 2 つの div があります。
.horizontal {
position: relative;
min-height: 100%;
height: auto !important;
height: 100%;
width: 100%;
display: inline-block;
overflow: hidden;
左側の div には次のスペーサーがあります。
.tspacer {
width:100%;
height:110px;
次に、iFrame があります。これは左の div の HTML です。
<div id="home" class="horizontal" style="font-family: 'Press Start 2P', cursive;">
<center><img src="img/light.png" class="home-light" /></center>
<div class="tspacer"></div>
<iframe src="iframe/home_slider.html" width="100%" height="300px" frameborder="0"></iframe>
</div>
右側の div にはテキストが含まれています。
<div id="ent" class="horizontal" style="background-color:#F00">
Entertainment
</div>
最後に、一体何が必要なのですか：
エンターテイメント div をページの上部にスナップする必要があります。このページには div のグリッドが含まれており (詳細についてはここをクリックしてください)、何らかの理由で、次の行と列の他のすべての div が最初のコンテンツによって押し下げられています (私が思うに) 私を混乱させるのは、スライダーには iframe の内側に影があり、右の div はその途中で始まるようです。とにかく、オフセットではなく、通常のグリッドに並べないのはなぜですか。