在整个页面宽度上扩展动态菜单 [英] Spread dynamic menu on full page width

问题描述

我有一个动态水平菜单。我想让它总是100％的页面宽度。
所以如果有6或8个项目，或者如果我想更改每个项目的标题，我不需要重新调整每个项目的大小。

I got a dynamic horizontal menu. I am trying to make it always 100% of the page width. So if there are 6 or 8 items or if I want to change the title of each item, I won't need to resize each item again.

菜单buit为< ul> < li>项目1< / li> < li>第2项< / li> ...< / ul> 列表。请看看我想要如何呈现（附图）。现在在我的html中的项目结束之前的全宽。

The menu buit as a <ul> <li>Item 1</li> <li>Item 2</li> ... </ul> list. Please see how I would like it to be presented (attached image). Right now in my html the items ends before the full width.

任何想法如何解决这个问题？我想如果我把菜单变成表格，它会解决这个问题，但我不推荐在这种情况下使用表格。

Any ideas how to solve this ? I think if I would turn the menu into table it would fix this, but I preffer not to work with tables in this case.

您可以在这里看到网站： a href =http://www.neutrinoteam.com/clients/angiologist.com/ =nofollow noreferrer>在此输入链接描述
感谢。

You can see the website here: enter link description here Thanks.

推荐答案

好的。所以终于我找到了解决方案。 CSS只，不需要JS。
其实很简单：

Ok. So finally I found the solution for that. CSS only, no JS needed. It's quite simple actually:

包装< ul> 应该有：

display: table

< li> 本身应该有：

display: table-cell

并删除它的浮动。

这就是：）

这篇关于在整个页面宽度上扩展动态菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！