我知道有大量的 CSS 并排定位问题,但我有一个独特的场景,我还没有看到任何有效的答案。
我无法更改以下 HTML block :
<div class="outer">
<div class="inner">
<label>...</label>
<table>...</table>
</div>
</div>
“外部”div 具有固定宽度,可以在运行时更改。 “内部”div 可以重复任意次数,宽度为 100%。
我需要每个 <label>
元素占用固定宽度150px,带<table>
元素占用剩余空间(即 100% 的剩余空间)。
无论我如何尝试使元素 float 等,我都无法使其正常工作。此外,此应用程序只能在装有最新版本的 Chrome/Firefox 的机器上使用,因此 IE 的向后兼容性不是问题。
谢谢!
最佳答案
您可以在 .inner
左侧添加一个填充,然后将 label
负边距放回该空间。
像这样:
.inner {
padding-left: 150px;
}
label {
width: 150px;
margin-left: -150px;
float: left;
}
table {
width: 100%;
border: 1px solid #000;
}
关于html - 将标签和表格并排放置,标签宽度固定,表格占据剩余的 100%?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20181968/