CSS不適用於家長

我有一個div ID = 「外部」裏面的ID是「容器」。我試圖調整相對於父項的外部div屬性，即其寬度，高度等應相對於Container div。我不明白爲什麼它沒有被應用。我知道，因爲這個原因，我的菜單也沒有調整。可以請別人找出我的代碼中的錯誤？謝謝。CSS不適用於家長

HTML代碼：

<body> 
<div id="container"> 
<header> 
<img width="60%" alt="Logo" src="images/logo.jpg"> 
<div id="divHeader"><br /><br /> 
<input type="text" placeholder="Enter text here"> 
<input type="radio" value="Pages" checked="true" name="searchOpt">Pages 
<input type="radio" value="Contact People" name="searchOpt"/>Contact People 
<input type="button" value="Search"/> 
</div> 
</header> 
<!--pop up menu--> 
<div id="outer"> 
<div id="menu"> 
<ul id="nav"> 
    <li id="nav1"><a href="">News & Events</a></li> 
    <li id="nav2"><a href="">Facilities</a></li> 
    <li id="nav3"><a href="">Research</a></li> 
    <li id="nav4"><a href="">Programmes</a></li> 
    <li id="nav5"><a href="">Faculty</a></li> 
</ul> 
</div> 
</div> 
</div> 
</body>

CSS代碼：

body { 

background-color:#0a1857; 
} 
#container 
{ 
width:80%; 
height:100%; 
background-color:#FFFFFF; 
position:fixed; 
right:10%; 
left:10%; 
} 
header 
{ 
width:100%; 
height:15%;} 

#divHeader 
{ 
float:right;} 

#outer 
{ 
padding-left:20%; 
width:80%; 
height:40%; 
background-image:url('images/image_31.jpg'); 
background-repeat:no-repeat; 
background-position:center; } 

#menu { 
position:relative; 
top:220px; 
right:170px; 
width:108%; 
height:20%; 
text-align:center; 
} 
#menu a { 
display: block; 
text-decoration: none; 
color: #3B5330;} 
#menu a:hover { background: #B0BD97;} 

#menu ul li { 
font:12px georgia; 
list-style-type:none; 
float: left; 
width: 20%; 
font-weight: bold; 
border-top: solid 1px #283923; 
border-bottom: solid 1px #283923; 
background: #979E71;} 
#menu ul li a { 
font-weight: bold; 
padding: 15px 10px;} 
#menu li{ 
position:relative; 
float:left;} 
#popup_menu ul li 
{ 
float:none; 
}

來源

2012-09-26 NightFury

我得到了我的問題的主要原因。我的孩子div的是根據瀏覽器的定位和安排本身，還不如說是因爲父：

position:relative;

我取代了它：

position:absolute;

參考從here

A 相對定位元素相對於其正常位置定位。相對定位元素的內容可以被移動和重疊等元素，但該元素的預留空間仍保存在正常flow.Used爲元件充當Containers.

一種絕對定位元件定位相對於具有非靜態位置的第一個父元素。如果找不到這樣的元素，則包含塊是html標記。

來源

2012-09-26 21:43:51 NightFury

你有沒有嘗試添加：

position: relative;

到鄰子宮div？

來源

2012-09-26 16:36:30 Max

我加了，但還是不行。如果我調整瀏覽器的大小，外部div和菜單都會從容器中取出。 – NightFury

CSS不適用於家長

回答

相關問題