使内联块段落元素占用父div的所有剩余空间

Question

我有这样的东西：http://jsfiddle.net/Bhr4Q/

现在，我希望p元素取div元素的剩余宽度。但我需要动态地执行（没有固定值），因为span元素可能不在其中，所以我希望p元素占用所有可用空间。我该怎么做？

Answer 1

当我看到"剩余空间"；我立刻想到了那张桌子：

div {
    display: table;
    width: 200px;
    padding: 20px;
    background-color: lightblue;
}
span {
    display: table-cell;
    background-color: blue;
}
p {
    display: table-cell;
    background-color: red;
}

剩余空间的计算方法为：

.fullWidth {
    width: 100%;
}

是的，表格仍然非常棒。

jsFiddle

请注意，我没有使用display: inline-block;，因为我们希望让内容填充整个表单元格

Answer 2

根据您的描述，span似乎是p的一部分？因此，您希望将span嵌套在p中，并将width:100%应用于p

http://jsfiddle.net/Bhr4Q/3/