2016-04-10 26 views
0

私は2つの兄弟sectionsを持っていて、最初のセクションでposition:absoluteを使用しましたが、2番目のセクションが上に表示されます。 2番目のセクションでposition:relativeを使用しましたが、動作しません。第二セクションの最初の兄弟が絶対位置を持つときに、先行する兄弟要素が上に流れるのはなぜですか?

#slideshow > figure { 
    animation: imageAnimation 30s linear infinite 0s; 
    backface-visibility: hidden; 
    background-size: cover; 
    background-position: center center; 
    color: transparent; 
    height: 100%; 
    left: 0px; 
    opacity: 0; 
    position: absolute; 
    top: 0px; 
    width: 100%; 
    z-index: 0; 
} 

とCSS:ここ enter image description here

最初のセクションのためのCSS

#education { 
    display: block; 
    position: relative; 
} 

は、私は2番目のセクションでは、最初のセクションの後に正常に流れて欲しいです。

+1

両方で相対的な位置を設定してみてください。 –

+1

それは、ポスティションの絶対的なものです、はい。 2つのセクションが互いに対して正常に表示されるようにするには、両方のセクションをコンテナに入れ、コンテナの位置を絶対的に指定します。 –

+1

あなたの質問を編集してください。最後に、次のように書いています。「2番目のセクションが正常に表示されるようにしたい(静的)」 - それは正しいことはできません... – Johannes

答えて

2

position: absoluteのものはすべて要素の流れから取り出されます。自動的にスペースは予約されません。質問のクリア後

ADDITION(relativestatic用以外):第二節では、最初の1未満に始める必要があり、それを最初に(絶対位置)セクションと同じくらい高いですmargin-topを得ました。これにより、最初のセクションの下に移動します。私はあなたのCSSの残りの部分を知らないので、私はあなたにはるかに詳細を与えることはできません。

関連する問題