html - 水平对齐 2 个 block (一个左浮动)

标签 html css css-float

我想水平对齐(对于任何屏幕分辨率)2 个主要 block 。 一个有一个 float:left。

如果我将 margin-left:auto 设置为 .site(主要内容 block ,在右侧),它会水平对齐。问题是我不知道如何让侧边栏(左边的 block )也对齐。这很困难,因为我需要确保菜单完全“附加”到内容 block (所以我不能使用 position:relative;left:XXpx,因为它会在不同的分辨率下发生变化)。

有什么想法吗? :)

编辑:如果可能,解决方案也适用于 IE 7-8(不幸的是):D

最佳答案

我可能在这里遗漏了一些东西,但您只想获取 2 个 block 元素并使它们水平居中对齐?

只需将它们包裹在另一个 div 中,并将包裹的 div 与 margin: 0 auto 对齐。

检查 this link .

<div id="#wrapper">
  <div id="sidebar">Sidebar</div>
  <div id="content">Content</div>
</div>

编辑: 当然,您还必须 float Content div(不仅是侧边栏)

关于html - 水平对齐 2 个 block (一个左浮动),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14085324/

相关文章:

html - 在从右到左的语言中(如阿拉伯语和希伯来语),括号反转

css - float div 的问题

css - 绝对定位 Div 之上的 float Div

javascript - 从 html 中的 select 标签获取值,我知道这会显示该值可能是重复的,但请看一下

html - 在父 div 中垂直放置多个子元素(两个 img 和一个 span)的 css,自动修复 span 中文本的字体大小

css - Wordpress - 根据用户 ID 而非用户角色编辑仪表板

html - 不透明度影响带 float 的 z-index

html - 隐藏表格滚动条

javascript - 带有粘性标题的可滚动 Div

html - 内部 HTML 样式不适用于元素? (HTML/CSS)