將固定寬度容器內的絕對元素居中

Question

我有一個固定大小的父項，其中嵌入了文本的絕對元素的圖像。

我想.video-text以瀏覽器窗口大小爲中心，而不是父div的固定寬度。

HTML：

<div class="video-bg"> 
    <img src="../images/video-bg.jpg" /> 
    <div class="video-text "> 
     <a href="#"><h3> Watch the video to learn more</h3></a> 
    </div> 
</div> 

CSS：

.video-bg { 
    position: relative; 
    overflow: hidden; 
    width: 1280px; 
} 
.video-bg img { 
    width: 100%; 
} 
.video-text { 
    position: absolute; 
    top: 44%; 
    left: 50%; 
} 

Answer 1

嘗試設置位置，以靜態的，而不是相對的。

帶位置的元素：static;沒有以任何特殊的方式定位;它始終按照頁面的正常流程進行定位。