CSS - 任何未设置宽度的跨度取余数

Question

如果我喜欢:

<div style="width: 100%">
   <span style="width: 5%">5% Width</span>
   ... (some more here)
   <span>Fill the leftover</span>
   ... (more span with width given)
   <span style="width: 5%">5% Width</span>
</div>

有没有办法让 span(放在列表中的任何位置)可以填充左边的宽度？

Answer 1

您应该使用 table 和 table-cell 的显示属性以这种方式完成:

<div style="width: 100%; display:table;">
   <span style="width: 5%; display:table-cell;">5% Width</span>
     ... (some more here)
   <span style='display:table-cell;'>Fill the leftover</span>
    ... (more span with width given)
   <span style="width: 5%; display:table-cell;">5% Width</span>
</div>