2015-02-24 127 views
0

好的我的網站有問題,我的頁眉和頁腳受到CSS的影響,但我的身體不是,我試過編輯這些值,但它似乎不起作用,但出於某種原因,如果我向背景顏色添加顏色,顏色會改變,但是位置不會。我卡住了。請幫忙。 這裏是我的CSS:PHP和CSS不能正常工作

#nav ul 
{ 
    overflow: hidden; 
    list-style-type: none; 
    margin: 0; 
    padding-left: 25%; 
    text-align: center; 
} 
#nav li 
{ 
    float: left; 
    padding-right: 10%; 
    background-color: red; 
} 
#nav a:link, a:visited 
{ 
    display: block; 
    width: 100%; 
    font-weight: bold; 
    color: #FFFFFF; 
    padding: 4px; 
    text-decoration: none; 
    text-transform: uppercase; 
} 
#nav a:hover, a:active 
{ 
    background-color: blue; 
} 

#footer 
{ 
    width: 50%; 
    position: absolute; 
    bottom: 0; 
    left: 25% 
} 

.body 
{ 
    width: 50%; 
    left: 25%; 
} 

這裏是我的PHP: 頭: 標題

<!--<script type="text/javascript"> 
     var j = Math.floor(8*Math.random()); 
     var s = new Array(); 
     s[0]="1"; 
     s[1]="2"; 
     s[2]="3"; 
     s[3]="4"; 
     s[4]="5"; 
     s[5]="6"; 
     s[6]="7"; 
     s[7]="8"; 
     s[8]="9"; 
     k=s[j]; 
     document.write("<style type='text/css'>body {background-image:url(../images/bg"+k+".jpg);background-attachment:fixed;background-size: 100% 100%;}</style>"); 
</script> 
--> 
</head> 
<body> 
<div id="nav"> 
<ul> 
<li><a href= "home.php">Refugio</a></li> 
<li><a href= "addAccommodation.php">Add accommodation</a></li> 
<li><a href= "login.php">Log In/Register</a></li> 
</ul> 
</div> 

首頁:

<?php 
session_unset(); 
include ('header.php'); 
?> 
<div class="body"> 
<b>Refugio</b> 
<form action= "results.php" method = "post"> 
Search Accommodation: 
<input type="search" name="accomSearch" required> 
</br> 
Arrival Date: 
<input type="date" name="bday"> 
</br> 
Departure Date: 
<input type="date" name="bday"></br> 
<input type="submit" value= "Search"> 
</form> 
</div> 
<?php 
include ('footer.php'); 
?> 

和頁腳

<div id = "footer"> 
<p>&#169&nbspCompany.<br /> 
If you have a trouble with our service 
<a href="mailto:[email protected]">Contact Us 
</p> 
</div> 
</body> 
</html> 
+2

我建議做一個jsfiddle它。這是一個CSS問題,與PHP不相關。 – 2015-02-24 19:01:11

+0

請正確縮進,以便我們可以閱讀這裏發生了什麼 – 2015-02-24 19:25:23

回答

0

您必須爲您的<div class="body"...設置包裝以設置一些寬度。

這寬度將是你的身體基礎計算25%

#nav 
 
{ 
 
overflow: hidden; 
 
width:70%; 
 
margin: 0 auto; 
 
    background-color: #E1E1E1; 
 

 
} 
 
#nav ul 
 
{ 
 
list-style-type: none; 
 
width:100%; 
 
text-align: center; 
 
} 
 
#nav li 
 
{ 
 
float: left; 
 
padding-right: 10%; 
 
background-color: red; 
 
} 
 
#nav a:link, a:visited 
 
{ 
 
display: block; 
 
width: 100%; 
 
font-weight: bold; 
 
color: #FFFFFF; 
 
padding: 4px; 
 
text-decoration: none; 
 
text-transform: uppercase; 
 
} 
 
#nav a:hover, a:active 
 
{ 
 
background-color: blue; 
 
} 
 

 
#footer 
 
{ 
 
    clear:both; 
 
width: 70%; 
 
margin 0 auto; 
 
position: absolute; 
 
bottom: 0; 
 

 
} 
 
.page{ 
 
    width:70%; 
 
    margin: 0 auto; 
 
    position:relative; 
 
} 
 
.body 
 
{ 
 
    border:solid 1px red; 
 
    margin:5px auto; 
 
    width:100%; 
 
    position:absolute; 
 
    
 
}
<html> 
 
<body> 
 

 
<div id="nav"> 
 
<ul> 
 
<li><a href= "home.php">Refugio</a></li> 
 
<li><a href= "addAccommodation.php">Add accommodation</a></li> 
 
<li><a href= "login.php">Log In/Register</a></li> 
 
</ul> 
 
</div> 
 
    
 
    <div class="page"> 
 
<div class="body"> 
 
    
 
<b>Refugio</b> 
 
<form action= "results.php" method = "post"> 
 
Search Accommodation: 
 
<input type="search" name="accomSearch" required> 
 
<br /> 
 
Arrival Date: 
 
<input type="date" name="bday"> 
 
<br /> 
 
Departure Date: 
 
<input type="date" name="bday"><br /> 
 
<input type="submit" value= "Search"> 
 
</form> 
 
    
 
</div> 
 
</div> 
 
<div id = "footer"> 
 
    <div> 
 
<p>&#169&nbspCompany.<br /> 
 
If you have a trouble with our service 
 
<a href="mailto:[email protected]">Contact Us</a> 
 
</p> 
 
    </div> 
 
</div> 
 
    
 
</body> 
 
</html>

0

我改變身體位置的CSS是absoulte和它的工作。 感謝@Alex的幫助,我使用了你的代碼

+0

您不應該在答案區域添加註釋。你看過/看過巡迴賽嗎? http://stackoverflow.com/tour。看看,你會發現更好的方式來使用stackexchange :) – 2015-02-24 20:37:00