Question

我有一个内部有四个其他div的div。最后三个具有固定宽度，但第一个需要水平调整大小。

以下是jsfiddle与CSS的代码： http://jsfiddle.net/nsCzp/

我在这里找到了一些答案，但无法使其发挥作用。

<div _unidade="1" class="unidade">
    <div class="unidade nome media">Canoinhas</div>
    <div class="unidade orcado media">9944</div>
    <div class="unidade realizado media">8467</div>
    <div class="unidade link media">1/div>
</div>

Answer 1

您可以在外部div上使用display:table，在内部div上使用display:table-cell。（并完全删除浮动）

.unidade {
    height: 40px;
    line-height: 40px;
    padding: 5px;
    text-shadow: 0 0;

    display:table;
    width:100%;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
.unidade .unidade{
    display:table-cell;
}

http://jsfiddle.net/gaby/nsCzp/2/

演示

三个固定的div和一个灵活的

1 个答案: