css - 对 CSS 绝对定位、浮动、居中感到困惑

Question

我已经阅读了一些关于 CSS 的文章和教程，所有这些都涵盖了绝对位置、浮动等。我认为我理解它，并且通常可以同时使用这两种方法并实现所需的设计。但是在这里和那里我遇到了一种情况，我不明白一个绝对定位或浮动的元素发生了什么，并且不能让它按照我需要的方式运行。所以我对这些 CSS 规则如何工作的理解中缺少一些东西。

这是一个具体的例子。我正在为一个非营利组织重新设计一个 WP 主题。在他们的设计中，他们希望以导航为中心。似乎没有什么比这更容易了。但到目前为止，我完全未能实现这一目标。

该网站的链接在这里：http: //justaddsolutions.com/d_build/

Answer 1

有多种方法可以实现这一目标。

第一

1. 将导航包裹在全宽包装器中。
2. 设置文本对齐：居中；对于包装器。
3. 设置显示：inline-block；或内联，用于导航栏。
4. 完毕！

第二个

如果您知道导航栏的确切宽度，可以尝试以下解决方案：

1. 设置位置：绝对；用于导航。
2. 设置左侧：50%；用于导航。
3. 将 margin-left 设置为导航的负宽度除以 2。
4. 完毕！

我相信还有更多方法可以实现这一点，但这两种方法对我来说非常有用！您不应该使用浮动进行中心对齐，仅用于左右对齐。