如何在不使用 position:absolute 的情况下布局侧边栏和主体 还是说得使用 float 浮动?
我一生都无法找到一种方法来完成这项工作。
如果我有 3 个 div(左侧边栏、主体和页脚),如何让侧边栏和主体彼此相邻而不将其位置设置为“绝对”或浮动? 执行这两个选项中的任何一个都会导致页脚 div 不会被其中一个或另一个按下。
无论这些元素之前是什么(例如另一个标题 div 或其他元素),我如何实现此目的?
如果有帮助,这里是我试图允许的两种情况的说明:
这是一个简化版本我当前设置的 HTML:
<div id="sidebar"></div>
<div id="content"></div>
<div id="footer"></div>
I can't for the life of me find a way to make this work.
If I have 3 divs (a left sidebar, a main body, and a footer), how can I have the sidebar and main body sit next to each other without setting their positions as "absolute" or floating them? Doing either of these options result in the footer div not being pushed down by one or the other.
How might I accomplish this regardless of what comes before these elements (say another header div or something)?
In case it helps, here's an illustration of the two cases I'm trying to allow for:
Here's a simplified version of the HTML I currently have set up:
<div id="sidebar"></div>
<div id="content"></div>
<div id="footer"></div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
您需要指定页脚来清除浮动:
这会强制它位于浮动元素下方。
其他清除选项有左和右。
You need to specify the footer to clear the float:
This forces it under floated elements.
Other options for clear are left and right.
执行这些选项中的任何一个都会导致页脚 div 不会被其中一个或另一个按下?
尝试这个工具
Doing either of these options result in the footer div not being pushed down by one or the other?
Try this tool
现在,如果你不想浮动任何东西,也不想使用position:absolute,那你就非常绝望了。
剩下的唯一选择是:
Right now you're pretty hopeless if you don't want to float anything, nor use position: absolute.
The only alternatives left are: