试图在 wordpress 骨架中将导航居中

Posted 2023-02-16

【中文标题】试图在 wordpress 骨架中将导航居中

【英文标题】：Attempting to center navigation in wordpress skeleton them

【发布时间】：2013-04-30 22:09:44

【问题描述】：

我正在使用 Skeleton 主题来创建响应式 wordpress 网站。我正在尝试使顶部导航居中，但无济于事。

这里是链接： http://bit.ly/13e2tIX

这就是我正在尝试的：

#navigation ul li 
position: relative;
display: inline-block !important;
text-align:center;
width: 100%;
color:#666;
text-transform: uppercase;

但这将使所有导航项居中并堆叠。任何帮助将不胜感激。

【问题讨论】：

您希望列表项在居中的 UL 中并排显示，还是希望它们堆叠并居中作为列表？

我希望它们并排显示，而不是像当前那样显示在列表中。以页面为中心。

【参考方案1】：

这个答案对我不起作用，但确实如此：

.menu-header

   display:inline-block;


#navigation

   margin:0 auto;
   text-align:center;

仅在 chrome inspector 中测试，但它似乎将 wp 骨架主题的导航菜单居中。

【参考方案2】：

试试这个：

#navigation ul 
    text-align:center;

#navigation ul li 
display:inline;
list-style:none;
position: relative;
color:#666;
text-transform: uppercase;

#navigation ul li a 
    display:inline-block;

你可以在这里看到 jsfiddle：http://jsfiddle.net/sb4NH/

【讨论】：

感谢您的帮助。它似乎仍然没有移动导航。我已将您的解决方案纳入我的代码，评论太长了。这是小提琴：jsfiddle.net/MLS1984/9qD9E

我检查了您的网站链接，它看起来正确 - 您发现了吗？顺便说一句，外观设计犀利！ :)