Question

基本上我有一个div，它包含四个div，它们都有浮动：离开最后一个它有浮动：右边。

我正在构建一个响应式网页。我希望“Name”列中的所有三列基本上占据他们所需的所有宽度。宽度的其余部分应该进入该列 - 如果这是有道理的。

<div style="width: 100%; border-bottom: 1px solid #e5e5e5; padding: 10px 0 10px; font-size: 1.2em; overflow: auto;">
            <div style="float: left; width: 5%;"><input type="checkbox" id="ID"></div>
            <div style="float: left; width: 5%;">Code</div>
            <div style="float: left; width: 80%;">Name</div>
            <div style="float: right; width: 10%;">100 &euro;</div>
        </div>

找到了解决方案！

我找到了解决方案！删除浮动并添加隐藏在应该调整的列上的溢出有助于获得我需要的东西！

    <div style="width: 100%; border-bottom: 1px solid #e5e5e5; padding: 10px 0 10px; font-size: 1.2em; overflow: auto;">
            <div style="float: left; width: auto; margin-right: 1%;"><input type="checkbox" id="ID"></div>
            <div style="float: left; width: auto; margin-right: 3%;">Code</div>
            <div style="float: right; width: auto; margin-left: 3%;">100 &euro;</div>
            <div style="overflow: hidden;">Name></div>

        </div>

Answer 1

指定div的浮动会强制内容围绕它流动，所以你应该没问题，只是不要浮动最右边的div并让它默认。在你的情况下，只需从100欧元的div中删除样式，它将占用剩余的空间。

这里的问题是设置显式宽度百分比并不是您想要的 - 您需要做的是使用javascript根据内部内容动态调整div的大小。

div中的四列：三个宽度取决于内容;剩下的就是第四个

1 个答案: