1. 首頁
  2. 問答
  3. css div floating

css div floating

2012-09-24 98 views
-4

我在容器內有兩個<div>標籤。其中一個漂浮在右邊，另一個漂浮在左邊。 我試圖排隊他們，但問題是，正確的一個下了左邊，並沒有浮動。css div floating

http://tinkerbin.com/QuHxRQXO

來源

2012-09-24 user1665569

+0

你的代碼檢查有一次錯誤。 –

+0

嗯......我不知道你說的究竟是什麼錯誤 – user1665569

+0

'Font'缺少結束標記，'p'在某些地方和特殊字符中有大寫字母。這些錯誤並不代表任何代碼問題，但你應該檢查它們。 :) –

回答

0

檢查這個fiddle。

它不是正確的浮動，因爲你正在給你的div的填充，這使得你的.rightside股利底部。而不是給填充內部元素填充div。

而不是給px給你div的百分比。它可以幫助你理解模式。

我從你的div中刪除了填充，並向下面的內部元素添加了填充。

h4,p{padding:5px;}

來源

2012-09-24 05:34:01

+0

檢查這個@ user1665569這也許是你想要的。 –

0 
It is working fine. I have checked except. 

change 
<font color= "#FFFFFF"><b>Site Contents</b> 
to 
<font color= "#FFFFFF"><b>Site Contents</b></font> 

<!doctype html public "-//w3c//dtd html 4.0 transitional//en"> 
<html> 
<head> 
<title> new document </title> 
<style type="text/css"> 
.subcontent{width:750px;} 
.menu { 
background-color :#FFD700; 
float: left; 
padding-bottom: 100px; 
width:170px; 
font-family: Verdana; 
font-size: 12px; 
} 
.rightside { 
background-color: #FFF; 
float:left; 
width:540; 
padding-left:10px; 
} 
</style> 
</head> 
<body> 
<div class="subcontent"> 
<div class="menu"> 
    <div class="submenu" style= "background-color:#A80000; text-align:center; width:120px; padding:10px"> 
     <font color= "#FFFFFF"><b>Site Contents</b></font> 
    </div> 

    <h4><b>Virtual Tour</b></h4> 
    <P>Explore the lab to know the insights of the new world!</p> 
    <h4><b>Experiments</b></h4> 
    <P>There is lot more to it that would fascinate you.</P> 
    <h4>Lab History</h4> 
    <P> Find out the need to make it underground.</P> 
</div> 

<div class = "rightside"> 
     <div id="separator" style="background-color: #A80000; height: 20px"> 
     </div> 
      <p id="para1"> Located 2,341 feet beneath the surface in an old iron mine, the lab is deep enough that particle physics experiments see less than 100,00 times the cosmic radiation than on the surface, allowing sensitive searches for exotic particles like neutrinos and dark matter.</P> 
    </div> 
    </div> 
</body> 
</html>

來源

2012-09-24 05:28:52 aravind3

+0

是的，但我想那個領域在底部的段落正好在菜單旁邊漂浮 – user1665569

+0

好吧，您希望在右側區域和內容上找到菜單。我是否正確使用...？ – aravind3

+0

是的，這就是我想要的 – user1665569

相關問題

 相關問題