html - 居中CSS中的元素

Question

我确定有人问过这个问题，通常我可以用 margin: 0 auto; 来完成这个问题。或其他东西，但在这个网站上:otgtires.com 我似乎无法让导航栏位于其父元素的顶部以居中。我会在这里粘贴一些代码，但我认为在浏览器中使用开发工具更容易。请让我知道我缺少什么!

编辑:如果它看起来已经居中，则缩小。

因此，如果您放大网站上的浏览器，您会看到所有其他元素保持相对位置，但导航栏保持在左侧。无论用户窗口如何放大/缩小，我都希望导航栏保持在页面中央。

Answer 1

它不是“居中”的，因为它当前使用的是基于百分比的宽度。尝试使用固定宽度:

#top_navigation {
    width: 500px;
    margin: 0 auto;
    }

编辑:

此外，考虑使用以下 clear-fix，因为导航元素是内联的，并且当浏览器宽度缩短时，下面的内容往往会混淆:

#top_navigation {
    overflow: hidden;
    }

这是您网站的屏幕截图，其中注入(inject)了上述代码以演示水平居中: