多个元素的inline-block能否呈现出和Table中的td一样的宽度均分？_html/css_WEB-ITnose
- WBOY原创
- 2016-06-24 11:32:161205浏览
现有个需求，就是做页面底部的tab按钮，比如
外框为了自适应页面宽度，使用nav{ width:100%; }的样式定义，而a元素作为tab按钮，使用了display:inline-block;height:60px;width:25%;这样定义，可以满足任何宽度下都能自适应。
现在的问题来了，由于服务端需要考虑权限的问题，这些按钮在某些权限下需要全部显示，而在某些权限下只能显示3个，而这里如果宽度在css中定义死了25%的话，如果仅显示3个按钮，美观度显然满足不了要求。虽然通过js能够对其进行修改，但个人的原则是能通过css解决的样式问题就不话费js的开销了。
所以想问下，就inline-block如何可以实现系列的宽度自适应。类似于原先的td特性，否则真心想直接用table布局这里了。
回复讨论(解决方案)
使用table+td的情况忽略了一个问题，未定义宽度的td将会导致td宽度会按td内容进行自动调整，所以会出现tab按钮宽度在按钮内容不一致的情况下宽度各不相同，也比较丑，疏忽了这个特性。临时用js解决吧，大家如果知道的不吝赐教。
html5是可以的
楼上，具体方法呢，给个提示也好
目前的做法都是用JS来控制需要局分的inline-block元素的width的百分比，比如有5个元素，那么就是100/5+"%"，配到比较纠结的就是除不尽的情况，比如3个的情况，暂时先结贴
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn