如何使菜单项均匀分布在菜单栏上

-1

我有一个网站，我正在努力..并想知道如何跨菜单项平均跨菜单栏。如何使菜单项均匀分布在菜单栏上

我知道如何在技术上做到这一点，但我想确保它是正确的。

我希望能够再添加一个菜单项，并仍然有它看起来正常或溢出正确等

好了，所以我加了

.wpsight-menu li { 
    width:14%; 
    text-align:center 
}

（更多菜单项被添加）

我的问题现在我S，即完整的菜单项不显示现在

http://phillysubrubanhome.com - 你可以看到它在做什么活

来源

2014-08-27 user3407087

好了，所以我结合你的方法与此这个和它的工作：

.wpsight-menu li { 
    width:14%; 
    text-align:center 
} 

.wpsight-menu a { 
    display: inline-block; 
    margin: 0 5px 0 0; 
    text-decoration: none; 
}

来源

2014-09-10 17:23:05 user3407087

使用CSS给你的锚（a）相同的填充和利润的左，右和li的百分比宽度，像这样;

ul#main-menu { 
    width: 100%; 
} 

ul#main-menu li { 
    width: 20%; /* for 5 menu items */ 
    padding: 0; 
    margin: 0; 
    display: inline-block; 
} 

ul#main-menu li a { 
    padding: 0px 5px; 
    margin: 0px auto; 
    display: block; 
}

并根据菜单项的数量更改li的宽度。

这应该做的伎俩！

来源

2014-08-27 17:56:12 worldofjr

我已经更新了原来的职位 – user3407087 2014-09-10 16:44:14

目前有5个菜单项，即时通讯假设您将添加另一个菜单项，从而使它6菜单项。

容器的宽度是980px。将其分为6个部分，达到163.33。我们需要给出宽度的百分比，即16.66％。

将每个li的宽度设置为16.66％并居中对齐文本。

你的CSS是如下：

ul#main-menu li{ 
    width:16.66%; 
    text-align:center 
}

来源

2014-08-28 06:52:52 WisdmLabs

我已经更新了原来的帖子 – user3407087 2014-09-10 16:48:51

如何使菜单项均匀分布在菜单栏上

回答

相关问题