为什么我的 CSS“left”属性没有使我的元素居中？

CSS“left”属性不起作用

在 CSS 中，“left”属性用于控制元素相对于其包含元素的水平位置。但是，必须确保包含元素具有定义的宽度、高度和位置，以便“left”属性正常工作。

参考您提供的代码示例，您正在尝试定位子元素div（“inner”）位于父 div（“outher”）内，使其左边缘使用“left: 50%”与父 div 的中心对齐。但是，您提供的代码未正确对齐子 div。

修复：

要正确定位子 div，您需要指定一个位置，而不是“static”表示包含 div（“outer”）。这是因为“静态”位置是 HTML 中元素的默认值，不允许精确定位。

调整后的代码：

#outher {
   width: 1000px;
   height: 1000px;
   background-color: #ccc;
   position: relative; // Add this line
}

#inner {
   width: 400px;
   height: 300px;
   background-color: #090;
   position: absolute; // Add this line
   left: 50%;
}

通过设置将子 div 的“position”属性设置为“absolute”，将包含 div 的“relative”设置为“relative”，则可以为“left”属性建立正确的参考点。这可确保子 div 相对于包含的 div 定位，并且其左边缘按预期与父 div 的中心对齐。

以上是为什么我的 CSS“left”属性没有使我的元素居中？的详细内容。更多信息请关注PHP中文网其他相关文章！