当有 3 个 item/div/elements 时,如何让中间的 div 自动调整为 100% 宽度?
喜欢
<div style="width:500px; height:50px;">
<div style="float:left; width:50px; height:50px; background-color:red;">
a
</div>
<div style="float:right; width:50px; height:50px; background-color:red;">
b
</div>
<div style="width:auto; height:60px; background-color:blue;">
middle
</div>
<div style="clear:both;"></div>
</div>
我不应该为中间 div 使用固定宽度,因为父 div 宽度 500px 将是响应宽度,在更改浏览器大小时进行调整。
我也试过
<div style="text-align:center;"> THIS WILL BE DYNAMIC WIDTH
<div style="display:inline-block; width:100px;">
First Div
<div style="display:inline-block; width:WHAT SHOULD I WRITE HERE?;">
Middle Div
</div>
<div style="display:inline-block; width:100px;">
Right Div
</div>
</div>
最佳答案
你只需要改变:
<div style="width:auto; height:60px; background-color:blue;">
到
<div style="margin: 0 50px; height:60px; background-color:blue;">
它会如您所愿地工作。
fiddle :http://jsfiddle.net/o0twxh5j/
希望对你有帮助
关于html - 如何自动调整中间div宽度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26194060/