為什麼我的 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中文網其他相關文章！