阻止 div 宽度将其推离原位
我有 2 个并排的 div。一种的固定宽度为 150px(侧边栏),另一种则调整为父 div 的剩余宽度。
<div style="margin:0 20%">
<div style="float:left;width:150px">
Sidebar contents
</div>
<div style="vertical-align:top">
Main contents
</div>
</div>
当“主”div 的内容超过剩余宽度时,它会展开并向下推到侧边栏下方。如何在不为该 div 定义设置宽度的情况下停止此操作(因为它旨在调整到父宽度)?
I've got 2 divs side by side. One has a fixed with of 150px (sidebar) and one adjusts to the remaining with of the parent div.
<div style="margin:0 20%">
<div style="float:left;width:150px">
Sidebar contents
</div>
<div style="vertical-align:top">
Main contents
</div>
</div>
When the contents of the "main" div exceed the remaining width, it's expanded and pushed down under the sidebar. How can I stop this without defining a set width for this div (since it's meant to adjust to the parent width)?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
第二个 div 的
margin-left:150px
?或使用padding-left:150px
来对齐内容margin-left:150px
for the second div? or usepadding-left:150px
for aligning contenthttp://jsfiddle.net/5TYm2/ 这是我相信您正在寻找的东西的工作示例。
这是在包装 div 中分离内容的一种非常常见的方法。
希望这有帮助。
http://jsfiddle.net/5TYm2/ here is a working example of something I believe you're looking for.
This is a pretty common way to go about separating content within a wrapping div.
Hope this helps.