如何防止div部分在下面移動？

我有一個搜索頁面，並且當我改變瀏覽器窗口的大小時，要防止右邊的「top20」div部分移動到由矩形四捨五入的部分下方。如何防止div部分在下面移動？

CSS：

#search_parameters_border { 
    border: 1px outset gray; 
    float: left; 
    padding: 10px;  
} 

#searchBox { 
    background-color: white; 
    color: black; 
    text-align: left; 
    margin-bottom: 15px; 
} 

#categories { 
    line-height: 20px; 
    height: 420px; 
    width: 250px; 
    float: left; 
    padding: 10px;   
    margin: 5px 5px 5px 5px; 
} 

#additionalFilters { 
    width: 700px; 
    float: left; 
    padding: 10px;  
    margin: 5px 5px 5px 5px; 
} 

#top20 { 
    width: 650px; 
    padding: 5px;   
    margin: 5px 5px 5px 50px; 
    float: left; 
}

的屏幕截圖：

enter image description here

來源

2014-09-26 tesicg

您需要使屏幕的最小寬度爲1370像素（或將它們放在具有該寬度的容器中） – Pete 2014-09-26 07:56:01

您是指在整個搜索屏幕上？ – tesicg 2014-09-26 07:57:41

＃top20 {position：absolute; left：0px;}？ – Hotted24 2014-09-26 07:59:29

由於您使用的是你需要給一個最小寬度的容器周圍所有寬度絕對值。比你top20 div不會移動。但是你應該考慮讓你的風格更流暢。

來源

2014-09-26 07:59:37

之前補充填充你是什麼意思「更流暢」？ – tesicg 2014-09-26 08:12:54

使用百分比爲你的寬度，或嘗試EM，我更喜歡。 – 2014-09-26 08:20:55

你的意思是使用「em」單位而不是像素？ – tesicg 2014-09-26 08:27:29

由於您沒有包含您的浮動元素，因此手機允許您將最後一個浮動按鈕放到您不想放置的地方。使用「容器」或「包裝器」div通常是個不錯的主意，因爲您會發現它們有時會引用您的網站的最大允許寬度以包圍您的構建版本（如果您希望獲得更多信息，請使用最小寬度）。）它會解決你的問題，並幫助你保持組織。同樣，就像在這種情況下一樣，如果遇到問題，有時將「容器」div中的屬性設置爲「position：relative」會更快一些。然後通過「position：absolute; top：100px; left：50px;」將絕對有問題的div定位或類似的間距。如果您對上述內容或其他評論有任何疑問，請告訴我，我可以更詳細地解釋。

來源

2014-09-26 08:22:36 tommydevs

如何防止div部分在下面移動？

回答

相關問題