css - 水平居中 2 个 div,没有包装

标签 css html alignment

我只想将 2 个 div 水平居中,而不管屏幕宽度如何,并且不使用包装器。我有以下简单代码:

#div1 {
     display: inline-block;
     width: 100px;
     border: 1px solid #000000;
}
#div2 {
     display: inline-block;
     width: 200px;
     border: 1px solid #000000;
}

为了说明,我创建了以下 fiddle : http://jsfiddle.net/axe89/

  • 我不想使用包装器的原因是我想制作一个跨平台网站,如果我为包装器定义宽度,它会破坏移动屏幕。

最佳答案

@setek 有上面的解决方案,只是想添加这个快速的经验法则:

要水平居中 display:inlinedisplay:inline-block 元素,请使用 text-align:center;

要水平居中 display:block 元素,请使用 margin: 0 auto;

关于css - 水平居中 2 个 div,没有包装,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23377729/

相关文章:

html - 页脚定位 html/css

html - 为什么 css 没有应用到我的网页?

jquery - 将一个 div 替换为另一个

css - 使用 html5reset 复制 css 行

html - 格式化按钮以在不使用位置的情况下随页面和其他页面元素缩放

jquery - 下拉菜单没有右对齐

javascript - jQuery Mobile 在点击时刷新当前页面

jquery - 动态标题栏/导航栏

html - 如何让这些文本内联显示?

emacs - 是否有一个不错的emacs模式用于显示和编辑由分隔符分隔的巨大文件?