我有一个用于表单的表格。这个解决方案需要自动调整到两种情况:
当右侧没有浮动div时,我希望表格占据100%的宽度。
当右侧有浮动div时,我希望表格给这个div留出空间,并占据剩余的水平空间。
我该如何做到这一点?
我有一个用于表单的表格。这个解决方案需要自动调整到两种情况:
当右侧没有浮动div时,我希望表格占据100%的宽度。
当右侧有浮动div时,我希望表格给这个div留出空间,并占据剩余的水平空间。
我该如何做到这一点?
overflow
属性的width:100%
属性。下面是代码示例,这里也有一个jsfiddle示例:http://jsfiddle.net/rgthree/uEt35/
CSS
.floater {
float:right;
}
.tbl-container {
overflow:hidden;
}
.tbl-container > table {
width:100%;
}
HTML
<div class="floater">
This is to the right.
</div>
<div class="tbl-container">
<table>
<tr>
<td>hi</td>
</tr>
</table>
</div>
您可以使用以下代码删除右侧的 div:
display:none;
您可以使用以下方式保留其空间
visibility:hidden;
您的表格将具有100%的宽度,因此当div样式为display:none时,div将不占用空间,表格将自然扩展。如果您仅隐藏div,则表格将保持较小的宽度,基于右侧div的宽度。
此信息可在W3Schools上找到。