2012-07-22 66 views
0

我正在嘗試用灰色背景顏色創建窗體部分的窗體。我想讓它浮動到左側,並有一個紅色框,其中的錯誤將直接顯示在右側。但是如果你看看它是如何顯示在我的鏈接http://www.yourfantasyfootballreality.com/createleaguevalidation.php中,你會看到該框只顯示在窗體的下面,並且窗體沒有灰色背景色。是否有人可以幫助我使窗體背景部分灰色,並有顯示在右邊的紅色方塊......窗體顯示元素錯誤

<html><head><title>Create a League</title></head> 

<body> 

<center><h1>Create a League</h1></center> 



<div class="form width:400px; height:200px; background-color:gray;"> 
<form action="createleaguevalidation.php" method="POST"> 
League Name:  <input style="margin-left:0px;" type="text" name="leaguename" value="<?=$leaguename?>" /><br /> 
Number of Members: <input type="text" name="members" value="<?=$members?>"/><br> 
League Password: <input type="password" name="leaguepassword" value="<?=$leaguepassword?>"><br> 
<input type="submit" value="Register" name="action"> 
</form> 
</div> 

<div style="background-color:red; height:200px; width:200px; float:left;"> 
</div> 

</body> 
</html> 

回答

4

你的問題就出在這條線從您的網站:

<div class="form width:400px; height:200px; background-color:gray;"> 

它或許應該閱讀更多的東西,像這樣是有效的:

<div class="form" style="width:400px; height:200px; background-color:gray;"> 

雖然我會建議不與內聯樣式造型了,而是有一個外部的樣式表。這樣一來,你可以簡化HTML像這樣:

<div class="form"> 

而你也有像這樣的CSS:

div.form { 
    width:400px; 
    height:200px; 
    background-color:gray; 
} 

另外,如果你想在紅色框出現在右邊,因爲您當前的造型,你會想一個float: left;添加到您的div.form元素,像這樣:

div.form { 
    width:400px; 
    height:200px; 
    background-color:gray; 
    float: left; 
} 
+0

哇。謝謝。我感覺像一個阻礙。我應該跳上短暫的巴士..哈哈。 – 2012-07-22 22:20:09

+2

我們都會犯這樣的錯誤 - 我做了很多次,我必須非常善於看到他們...... – 2012-07-22 22:20:47

+0

當然。謝謝您的幫助。 :) – 2012-07-22 22:21:34