Javascript 动态生成的等宽选项卡项

我正在创建需要宽度相等的选项卡，它将动态出现（2-8个选项卡）。没有固定宽度，选项卡栏具有流体宽度。我曾试图通过css实现它，但没有成功

演示：

您可以使用CSS固定表格布局，浏览器支持：IE8+

.tabs{
列表样式：无；
填充：0；
保证金：0；
显示：表格；
边界塌陷：塌陷；
表布局：固定；
宽度：100%；
}
李先生{
显示：表格单元格；
文本对齐：居中；
垂直对齐：中间对齐；
边框：1px纯红；
}

项目-长项目
项目
项目
项目
项目
项目
项目
项目

你是这个意思吗？你应该试着把样式放在divs上：width:120px；你可能想看看Flexbox@sdcr，在条内有2-8个标签。制表符应始终占据相等的宽度，并应覆盖条的整个宽度。@jlego不能使用flex box，因为它不支持IE11以下的内容。我相信唯一的解决方案是jquery，我不擅长它。

<div class="main">
<ul class="list-inline sub-cat-tabs">
  <li>
    <div>
      <a href="javascript:void(0)" class="active"><span>2014-2015 2014-2015</span></a>
    </div>
  </li>
  <li>
    <div>
      <a href="javascript:void(0)" class=""><span>2015-2015</span></a> 
    </div>
  </li>
</ul>
</div>