社交媒体按钮定位

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;用于内容DIV。将内容DIV设置为position: absolute;或position: relative;将为子元素的定位建立新的来源...请参阅此fiddle以快速演示绝对定位的元素表现在另一个定位元素内。

但是，从文档流程中删除了带有position: absolute;的元素......就推送页面上的其他内容而言，它们没有“实质内容”。出于这个原因，您很可能不希望将内容DIV设置为position: absolute;。如果您要在DIV之后添加更多内容，则不会按预期在页面底部结束，而是最终落在绝对定位的内容DIV之后。 position: relative;将按预期工作，并会为您提供一个新的坐标系统，以便将您的社交媒体按钮绝对定位到它的一边。