我正在尝试在固定高度的框内制作一个垂直导航栏。我怎样才能使按钮动态地平均改变高度以适应框内？这是一个 jsfiddle 来证明我的意思。
所以现在如果我要添加第六个或第七个按钮，它们将被均匀拉伸(stretch)以适应 nav 容器。是否可以仅使用 css 来实现，还是应该使用 javascript/jquery 进行干预？
注意:它们将使用后端 php/mysql 应用程序添加，而不是通过代码添加。
另请注意，我目前的高度是使用填充完成的，因为我希望文本在按钮内居中。
谢谢
最佳答案
你问题中的问题是你给了父元素固定大小的高度，你希望子元素被拉伸(stretch)以填充父元素。
- 所以你必须以百分比的形式给出 li 的高度。
- 关于文本的垂直居中，您可以使用 display:table-cell、vertical-align:middle 属性，但是使用表格进行布局并不是最佳做法。
- 所以我使用位置来居中对齐文本。
这是jsbin:
http://jsbin.com/jirozicifedo/2/
这是动态解决方案(Javascript):
关于javascript - 使用CSS自动拉伸(stretch)元素以适应父容器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25497466/