Div的位置

嗨，這是我的CSS和HTML代碼。有幾個div。當瀏覽器的大小是最大的沒有問題，但是當我改變瀏覽器大小更小，然後div位置改變。例如：<div id="cnrht"> id "cnrht" İçeriği Buraya Gelecek</div>在頁面右側，但是當瀏覽器變小時，它會在其他div和左邊。我如何編輯它。Div的位置

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Başlıksız Belge</title> 
<style type="text/css"> 

* { 
margin: 0; 
padding: 0; 
} 
html { height:100%; 
width:100%;} 
body { 
font-family: Arial,Helvetica,sans-serif; 
font-size: 75%; 
line-height: 1.5em; 
height:100%; 
width:100%; 

} 
#wrapper { 
    height: 100%; 
    width: 100%; 
    border: thin solid #F00; 
    position: relative; 
    visibility: visible; 
    z-index: 1; 
} 
#container { 
    border: thin dotted #006; 
    z-index: 2; 
    width: 100%; 
} 
#header { 
    background-color: #993; 
    clear: both; 
    height: 100px; 
    width: 100%; 
} 

#contain { 
    background-color: #9F6; 

    width: 100%; 


} 
#cnlft { 
    background-color: #C69; 
    padding: 10px; 
    height: auto; 
    width: 180px; 
    float:left; 
} 
#cncnt { 
    background-color: #F00; 
    padding: 10px; 
    width: 700px; 
    height: auto; 
    float:left; 
} 

#cnrht { 
    background-color: #0FF; 
    padding: 10px; 
    float: left; 
    width: 180px; 
    height: auto; 
} 

.clr {clear:both;} 
</style> 
</head> 

<body> 
<div id="wrapper"> 
    <div id="container"> 
    <div id="header">id "wrapper" İçeriği Buraya Gelecek</div> 
    <div id="contain"> 
     <div id="cnlft">id "contain" İçeriği Buraya Gelecek</div> 
     <div id="cncnt"> id "cncnt" İçeriği Buraya Gelecek</div> 
     <div id="cnrht"> id "cnrht" İçeriği Buraya Gelecek</div> 
<div class="clr"></div> 
    </div> 
    </div> 
</div> 
</body> 
</html>

來源

2012-08-02 user1508831

如果我用這樣是工作，但我不想要使用它：與：20％ – user1508831 2012-08-02 19:48:46

爲什麼你不想使用它？ – 2012-08-02 19:50:47

我必須使用嗎？如果我不能使用 – user1508831 2012-08-02 19:55:03

如何有關添加的最小寬度與含元素

#contain { 
    background-color: #9F6; 
    min-width: 1120px;/*sum of all the widths of its children*/ 
    width: 100%; 
}

FIDDLE

來源

2012-08-02 19:55:55 Musa

謝謝，穆薩它工作。你是土耳其人嗎？ – user1508831 2012-08-02 19:58:33

@ user1508831 http://stackoverflow.com/users/1353011/musa – Musa 2012-08-02 19:59:32

穆薩也是土耳其的名字。 – user1508831 2012-08-02 20:00:14

必須設置容器的寬度以像素，或者設定在％的子元素的寬度。因爲，當用戶縮小瀏覽器窗口（或監視器分辨率）時，如果容器寬度用％表示，容器將減少，並且如果容器寬度用px表示，則容器寬度將保持不變，只有滑塊添加到窗口，因此用戶必須立即滑動以查看所有內容。

如果您希望一個元素適應用戶窗口（分辨率），所有其他元素也必須是自適應的。

有最小寬度CSS屬性，但它會增加滑塊也一樣，如果用戶的瀏覽器窗口（或分辨率）小於最小寬度值:)

來源

2012-08-02 19:57:53 SomeoneS

我希望容器的寬度與整頁相同。什麼是容器的寬度？ – user1508831 2012-08-02 20:08:29

可以請你告訴包裝，容器，標題和包含的寬度？ – user1508831 2012-08-02 20:12:05

好吧，像musa說的，1120px，因爲這是所有兒童元素的寬度。 – SomeoneS 2012-08-02 21:06:00

回答

相關問題