在調整窗口大小時停止元素移動

Question

我爲我的頁面構建了一個標題欄。它由元素組成，內部是一些元素，，。我可以很好地放置所有東西，但是當我調整瀏覽器窗口的大小時，所有內容都開始移動並重疊在標題中。給頭，甚至身體固定與像「寬度：1000px」解決了這一問題，但這是屏幕尺寸相關。

如何獲取我的頁面，以便瀏覽器窗口的任何大小調整都會導致滾動條出現以查看隱藏的內容，並且這不會依賴像素中的硬連線分辨率。

Answer 1

給你的主div（通常是你的包裝div）一個min-width: ...px。

像這樣：

<div class="wrap"> 
    <div class="header">...</div> 
    <div class="content">...</div> 
</div> 

.wrap { 
    width: 95%; 
    min-width: 900px; 
} 

在上面的例子中，包裝的div將總是至少900px。 當窗口被調整爲更小的寬度時，將出現滾動條。

如果屏幕大於900px，則div的寬度將爲95％。