HTML設計問題

我在html設計中遇到了問題。當我創建一個新的div到leftbox DIV的id中時，這個div會掉下來。但是當我在新divs中使用絕對位置時，它完美地工作。請幫助HTML設計問題

#cont { 
 
    width: 60%; 
 
    border: 2px solid red; 
 
    margin: auto; 
 
    background: #ff3333; 
 
} 
 

 
#leftbox { 
 
    display: inline-block; 
 
    width: 45%; 
 
    height: 400px; 
 
    border: 2px solid green; 
 
    margin-left: 2%; 
 
    background: #00ff00; 
 
} 
 

 
#rightbox { 
 
    display: inline-block; 
 
    width: 45%; 
 
    height: 400px; 
 
    border: 2px solid blue; 
 
    background: #0000ff; 
 
}

<!DOCTYPE html> 
 
<html> 
 

 

 
<head> 
 
    <meta charset="utf-8"> 
 
</head> 
 

 
<body> 
 
    <div id="cont"> 
 
    <div id="leftbox"> 
 
     <div>my div</div> 
 
    </div> 
 
    <div id="rightbox"></div> 
 
    </div> 
 

 
</body> 
 

 
</html>

來源

2017-03-08 Ashwini kaptiyal

我不明白你的問題是什麼。你說了一些關於它的工作？問題是什麼？ – Gab

提供jsfiddle鏈接。 –

https://jsfiddle.net/ashwinik47/mjk5mssj/ –

適用以下樣式到插入leftbox格新的div。

float:left;

來源

2017-03-08 05:32:52 Devendra

但問題是爲什麼它掉下來。 –

如果您將使用overflow：auto;到左邊框它也將工作。內部div不在包裝內。 – Devendra

我第一次這麼認爲，但是我的寬度和高度都小於父div。我用這個顯示內聯塊。但仍然下跌 –

回答

相關問題