来自CSS的问题

来自CSS的问题,css,Css,我试图在我的主要内容中创建一个相当基本的表单。我确信我的编码是错误的,这让我发疯。注意我的代码。我在IE7中得到了非常宽的垂直间距,字段集之间的底色不能正常工作。在FF中一切都好 My CSS is: fieldset { margin: 1.5em 0 0 0; padding: 0; border-style: none; border-top: 1px solid #BFBAB0; background-color: #FFFFFF; } l

我试图在我的主要内容中创建一个相当基本的表单。我确信我的编码是错误的,这让我发疯。注意我的代码。我在IE7中得到了非常宽的垂直间距,字段集之间的底色不能正常工作。在FF中一切都好

My CSS is:
fieldset {  
margin: 1.5em 0 0 0;  
padding: 0;  
border-style: none;      
border-top: 1px solid #BFBAB0;      
background-color: #FFFFFF;    
}  
legend {  
margin-left: 1em;  
color: #000000;  
font-weight: bold;  
}  
fieldset ol {  
padding: 1em 1em 0 1em;  
list-style: none;  
}  
fieldset li {  
padding-bottom: 1em;  
}  
fieldset.submit {  
border-style: none;  
}

{
var w = document.myform.mylist.selectedIndex;
var selected_text = document.myform.mylist.options[w].text;
alert(selected_text); 
} 

label em {        
display: block;        
color: #900;        
font-size: 85%;        
font-style: normal;        
text-transform: uppercase;       
}
这是我的html代码

<div id="mainContent1">
<form name="myform">
<label for="mylist"><strong>Select an Account Type:</strong></label> 
<select name="mylist"><option value="traditional">Traditional Account</option>
<option value="paperless">Paperless Account</option>
</select>
</form>

<br /><a> </a>  

<form action="example.php">  
<fieldset>  
<legend>Contact Details</legend>  
<ol>  
<li>  
<label for="name">Name:</label>  
<input id="name" name="name" class="text" type="text" /> 
<label for="name">        
<em>required</em>      
</label> 
</li>  

<li>  
<label for="email">Email address:</label>  
<input id="email" name="email" class="text" type="text" /> 
<label for="name">        
<em>required</em> 
</li>  

<li>  
<label for="phone">Telephone:</label>  
<input id="phone" name="phone" class="text" type="text" /> 
<label for="name">        
<em>required</em> 

<ol>      
<li>      
<input id="option1" name="option1"      
class="checkbox" type="checkbox" value="1" />      
<label for="option1">Savings</label>      
</li>      

<li>      
<input id="option2" name="option2"      
class="checkbox" type="checkbox" value="1" />      
<label for="option2">Checkings</label>      
</li>      
</ol>       

</fieldset>  
<fieldset>  
<legend>Delivery Address</legend>  
<ol>  
<li>  
<label for="address1">Address 1:</label>  
<input id="address1" name="address1" class="text"  
type="text" />  
</li>  

<li>  
<label for="city">City:</label>  
<input id="city" name="city" class="text" type="text" />  
</li>  
<li>  
<label for="postcode">Zip Code:</label>  
<input id="postcode" name="postcode"  
class="text textSmall" type="text" />  
</li>  

<li>  
<label for="country">Country:</label>  
<input id="country" name="country" class="text" type="text" />  
</li>  
</ol>  
</fieldset>  

<fieldset class="submit">  
<input class="submit" type="submit" value="Submit" />  
</fieldset>  

<fieldset class="clear">  
<input class="clear" type="clear"  
value="Submit" />  
</fieldset>  
</form>

选择帐户类型:
传统帐户
无纸账户

联系方式
  • 姓名: 必修的
  • 电邮地址: 必修的
  • 电话: 必修的
  • 储蓄
  • 支票
  • 送货地址
  • 地址1:
  • 城市:
  • 邮政编码:
  • 国家:

  • 首先,去掉CSS文件中的脚本

    Firefox/兼容浏览器和IE对图例和字段集的处理非常不同,不幸的是。。。这可能就是你看到的问题:

    确保css文件中id前面有一个“#”,类前面有一个“.”。不这样做会引起混乱。

    不知道为什么css中有JS代码。。可能会引起一些问题!嗯,那不是真的。他在CSS中只使用了一个类,并且正确地标记了它。不这样做不会引起混乱,只是制定了不同的规则。没有点或散列的规则是关于标签的。