scu*_*ffe 1 internet-explorer padding internet-explorer-7
在Firefox和IE8中这不是问题,但在IE6和IE7中我似乎无法将单选按钮上的填充/边距减少到合理的范围(例如0px或1px).
在包含的图像中,你可以看到IE6/IE7上的红色背景很大(即使CSS填充和边距都设置为0px),但在Firefox/IE8中它很好.
当然,原因是我正在渲染的树看起来很糟糕,IE6/IE7中的空白.
替代文字http://img190.imageshack.us/img190/9985/ie7l.png
替代文字http://img23.imageshack.us/img23/3411/ie8k.png
注意:页面以标准模式运行,红色仅用于说明.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>IE Radio button padding hell</title>
<style>
input{
background-color:red;
border:0px;
margin:0px;
padding:0px;
}
</style>
</head>
<body>
<form name="asdf">
<input type="radio" name="sdfgsd" value=""/>asdf<br/>
<input type="radio" name="sdfgsd" value=""/>asdf<br/>
<input type="radio" name="sdfgsd" value=""/>asdf<br/>
<input type="radio" name="sdfgsd" value=""/>asdf<br/>
</form>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
小智 5
使用高度来解决这个问题.
我在课堂上使用这个输入:
.radiobtn
{
border:0px;
height:14px;
}
Run Code Online (Sandbox Code Playgroud)
上:
<input type="radio" class="radiobtn" name="radio" value=""/> Yes
Run Code Online (Sandbox Code Playgroud)
它将在IE 6.0/7中正常工作.