保留絕對定位和居中div的窗口大小調整大小

我的頁面上有幾個div，它們用作容器。以下是其中一個div的示例CSS代碼：保留絕對定位和居中div的窗口大小調整大小

header { 
    background-color: #fff; 
    height: 153px; 
    width: 97%; 
    min-width: 1084.06px; 
    margin: 15px auto; 
    position: absolute; 
    left: 0; 
    right: 0; 
    border-radius: 20px; 
}

這是我的標題的居中容器。還有其他幾個容器，我已經用simillar方式（絕對，居中和寬度以百分比表示）。

問題是，當我調整窗口大小時，所有這些容器都碰到瀏覽器窗口的左側。我想在特定的窗口寬度上保存一些邊距。我怎樣才能做到這一點？

P.S.如果我添加margin-left它打破了DIV

來源

2016-12-28 qazerty23

您可以移除寬度，並將左右值更改爲一些百分比（例如5％）。或者您可以使用媒體查詢（https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries） – Armin

感謝@Armin，刪除寬度並向左右值添加百分比實現了我想要的！我也將學習媒體查詢！ – qazerty23

添加另一個保證金右再伸直它取決於你用什麼

來源

2016-12-28 15:23:06 Coomernatior

您可以使用媒體查詢我的中心位置，媒體查詢只適用於特定的條件，如特定的寬度。

例如以下背景色規則將無法辦理屏幕寬度大於480像素：

@media screen and (max-width: 480px) { 
    body { 
    background-color: lightgreen; 
    } 
}

欲瞭解更多信息有關媒體查詢看到this w3schools page

來源

2016-12-28 16:14:52

保留絕對定位和居中div的窗口大小調整大小

回答

相關問題