Question

给出

<table width="100%">
    <tr>
        <td>Percentual<td>
        <td>Percentual<td>
        <td>Fixed 50px <td>
        <td>Fixed size<td>
        <td>Fixed size<td>
    </tr>
</table>

是否有可能有一个表格包含一些单元格（<td>）固定宽度（如50px, 20px ...）和其他单元格除以％（25%, 25%, 50%）重新释放空间？

我似乎无法获得这个，因为％1占用了所有可用空间......

我只关心它在laster firefox浏览器中工作，但最新的chrome和ie也会很好

这没有帮助Can you mix % and px to align a table?

Answer 1

您可以使用CSS3 flexbox。它的工作原理如下：

<div class="box">
    <div class="flex">Percentual</div>
    <div class="flex">Percentual</div>
    <div class="fixed">Fixed 50px </div>
    <div class="fixed">Fixed size</div>
    <div class="fixed">Fixed size</div>
</div>

CSS

.box {
  display: -webkit-box;
  display: -moz-box;
}

.flex {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
}

div.fixed {
  width: 50px;
}

http://jsfiddle.net/DFTR4/（调整浏览器窗口大小）

Answer 2

<强>已更新

你不能单独使用CSS，你需要添加一些像这样的jquery：

_width = ($('table').width() - $('#brian').width());

// Set widths as 'px'
//td_width_px = (_width / 3)
//$("td:not(#brian)").css("width",td_width_px+'px');

// Set widths as '%'    
td_width_pCent = (((_width / 3) / $('table').width()) * 100);
$("td:not(#brian)").css("width",td_width_pCent+'%');

我编写了这个代码供您查看 - http://jsfiddle.net/ajthomascouk/sVadG/1

注意：可能有更好的方法来计算百分比，但我想给你一个答案。

是否可以使用％AND px指定表格单元格？

2 个答案: