一个液体 div 和一个固定大小的 div

发布于 2024-08-23 17:33:14 字数 468 浏览 6 评论 0原文

我正在尝试构建一个布局，其中有一个固定宽度的 div 和旁边有一个液体宽度的 div：

<div id="main" style="width:100%; height:500px; background-color: #ccc;">
    <div id="right" style="float: right; width:100px; height:500px; background-color: red;">
    </div>
    <div id="left" style="float: right; width: auto; height:500px; background-color: orange;">
    </div>
</div>

左侧 div 没有填充其宽度，我也希望这个 div 在右侧 div 不存在时填充整个主 div，我怎样才能做吗？

原文

I am trying to build a layout which has a fixed width div and a liquid width div beside it :

<div id="main" style="width:100%; height:500px; background-color: #ccc;">
    <div id="right" style="float: right; width:100px; height:500px; background-color: red;">
    </div>
    <div id="left" style="float: right; width: auto; height:500px; background-color: orange;">
    </div>
</div>

the left div is not filling its width, also i want this div to fill whole main div when right div is not present, how can i do it ?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

不奢求什么 2024-08-30 17:33:14

我认为你想要的更像是

<div id="main" ... >
  <div id="right" style="float: right; width: 100px;"> Will take up 100 px </div>
  <div id="left" style="margin-right: 100px;"> Will take up the rest </div>
</div>

I think what you want is more like

<div id="main" ... >
  <div id="right" style="float: right; width: 100px;"> Will take up 100 px </div>
  <div id="left" style="margin-right: 100px;"> Will take up the rest </div>
</div>

回复收藏 0 原文

~没有更多了~