内联divs宽度问题

Question

我想获得如下的布局，需要使用无法修改的html结构。下面

的小提琴工作正常非IE浏览器，但IE 9和10为每个按钮拉伸100％。

我正在使用display：table和table-cell。我认为每个按钮上的100％宽度都会导致此问题，但无法找到另一种均匀拉伸按钮的解决方案，将文本对齐并正确地悬停。

我无法更改html结构。

http://jsfiddle.net/9seuhjmt/

.c-control-latch-buttons.tri-option-latch-buttons span.c-label { 
     display: table-cell; 
     width: 100%; 
    } 

我有一种感觉，我是在复杂的事情，所以任何建议大加赞赏。

Answer 1

这是你在找什么？

http://jsfiddle.net/9seuhjmt/19/

它的表现同样在我的IE 9和Chrome现在。

我改变了表单元格的区域的三分之一肥胖型（34吸尘器吸尘时避免深色边框）：

.c-control-latch-buttons.tri-option-latch-buttons span.c-label { 
    display: table-cell; 
    width: 34%; 

IE未容纳有100％的宽度的所有小区。但是，当更改为34％时，它显示-moz-linear-gradient背景色（灰色）。在IE浏览器上悬停是有问题的，因为回退的背景和原始的CSS发现。我删除了这些，它在这里工作。如果你可以保持简单的颜色，那么删除这些样式可能是解决方案。