css - 如何在 div 中将绝对定位的元素居中?

标签 css css-position center absolute

我想在窗口中央放置一个 div(带有 position:absolute;)元素。但是我在这样做时遇到了问题,因为宽度未知

我尝试了以下 CSS 代码,但需要进行调整,因为 width 是响应式的。

.center {
  left: 50%;
  bottom: 5px;
}

我怎样才能做到这一点?

最佳答案

这对我有用:

#content {
  position: absolute; 
  left: 0; 
  right: 0; 
  margin-left: auto; 
  margin-right: auto; 
  width: 100px; /* Need a specific value to work */
}
<body>
  <div>
    <div id="content">
      I'm the content
    </div>
  </div>
</body>

关于css - 如何在 div 中将绝对定位的元素居中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43528666/

相关文章:

css - wordpress网站中的主菜单背景颜色更改

html - 悬停时将其他菜单向右移动时的菜单

html - li {display : table-cell; position: relative;} with absolutely positioned div inside behaves differently in (FF4, WebKit) vs (Opera, IE9)

javascript - 改变div的位置

html - 将 DIV 中包含的一系列图像垂直居中时出现问题

html - 表单不会在 CSS 中居中

css - Beautifyrc SCSS 在关闭花括号后添加新的白线

html - 在 Bootstrap 中更改列高

css - 我可以使用纯 CSS 根据元素的祖先位置属性设置元素样式吗?

javascript - 多边形每边的中心