css - ソーシャル メディア ボタンの配置

Question

コンテンツ div の横にソーシャル メディア ボタンをどのように配置しますか?
ここのように: http://adidasgolf.eu/home.aspx

絶対配置？しかし、コンテンツ div も絶対に配置する必要がありますよね? これは私がこれまでに持っているものです...ソーシャルメディアボタンなし.

http://www.swiftgeckotech.com/golf01.html

ありがとう。

Answer 1

コンテンツ div は、ソーシャル アイコンと完全に一致するように配置する必要はありません。コンテンツ div で通常のレイアウトを維持し、ソーシャル アイコンをコンテンツ div の外に配置して、絶対に配置することは自由です。その層状の効果を得るために、z-indexing を行う必要があるかもしれません。

Answer 2

ほとんどposition: relative;の場合、 content に使用しますDIV。コンテンツDIVを or のいずれかにposition: absolute;設定するposition: relative;と、子要素の配置のための新しい起点が確立されます…絶対配置された要素が別の配置された要素内でどのように動作するかの簡単なデモについては、このフィドルを参照してください。

ただし、 の要素position: absolute;はドキュメント フローから削除されます。ページ上で他のコンテンツをプッシュするという点で、それらには「実体」がありません。このため、コンテンツDIVを asに設定したくない場合がほとんどです。position: absolute;その後にさらにコンテンツを追加するとDIV、期待どおりにページの下部に配置されず、絶対に配置されたコンテンツの背後に配置されますDIV。position: relative;ただし、期待どおりに機能し、ソーシャル メディア ボタンをその側に完全に配置するための新しい座標系を提供します。