html - div 水平居中

标签 html css position alignment

我的页面布局:

div for header : position: fixed
div for sidebar: float: left              div for content: float:left
div for footer : position: fixed

位置设置为这样,以便无论用户位于滚动条中的哪个点,页脚和页眉始终可见。然而,侧边栏随页面滚动。

内容的 div 包含 ui:insert,因此所有页面都会加载到那里。 现在,在其中一页中,我希望内容在分配的空间内居中。 为此,该页面的所有内容都放置在 div 中。 无论窗口拉伸(stretch)到什么尺寸,我都必须使用什么样式才能使内容始终水平居中。我可以为 div 的宽度指定一个固定值。

我无法将位置设置为绝对或固定,因为这会破坏整体设计。

最佳答案

对于固定宽度:

div.center {
    width: 300px;
    margin: 0 auto;
}

对于动态宽度:

div.center {
    width: 50%;
    margin: 0 25%;
}

JSFiddle 无法使用,但我会尽快安装一个。

关于html - div 水平居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15886740/

相关文章:

jquery - 为多个表着色奇数行

css - 覆盖 :root CSS variables from inner scopes

html - 如何以不再水平居中的方式重新定位输入字段的文本?

javascript - 拖放时获取元素在列表中的位置 (ui.sortable)

html - 立即增加 Bootstrap 组件大小(输入、标签、字体、按钮等)

html - iOS 不尊重 z-index 与 -webkit-overflow-scrolling

具有垂直内容等同全屏分布的CSS flex box

css - 在 Cambria 的字体中使用本地 src

html - 将一个 div 置于其他两个 div 之上居中

javascript - 隐藏/显示元素和更改按钮