gpt4 book ai didi

html - 我该如何解决这个 IE7 margin 问题?

转载 作者:太空宇宙 更新时间:2023-11-04 16:20:58 25 4
gpt4 key购买 nike

我已经为输入框设置了边距底部。在 Firefox4 中,输入框和 .link 之间的间距似乎很好,但使用 IE7,间距似乎加倍了。我该如何解决这个问题?

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link type="text/css" href="css/Exam.css" rel="stylesheet" />
</head>

<body>
<!-- start wrapper -->
<div class="wrapper">

<!-- start header -->
<div class="header">
<div class="Login">
<h1>User Login</h1>
<form name="Login" method="#" action="#">
<input type="text" value="User Name" />
<input type="password" value="password" />
</form>
<div class="links"><div>Not yet a Member?</div> <a href="" class="Register">&nbsp;Register Now</a> <a href="" class="btn_login"><span>Login</span></a></div>
</div>
</div>
<!-- End header -->

<!-- Start main -->
<div class="main"></div>
<!-- End main -->

<!-- start footer -->
<div class="footer"></div>
<!-- End footer -->

</div>
<!-- End wrapper -->
</body>
</html>

CSS 文件:

@charset "utf-8";
/* CSS Document */

/* CSS Reset */
ul,li,h1,h2,h3{padding:0;margin:0;}
ul{list-style:none;}

/* CSS for wrapper */
.wrapper{background:#fffde4 ;width:601px;margin:0 auto;border:#000 thin groove;color:#bb9d59;padding:17px 28px 28px 35px;font-family:Arial, Helvetica, sans-serif; }

/* Header */
.header{width:601px;overflow:hidden;}
.Login{width:390px;float:right;}
h1{margin-bottom:7px;color:#2c787b;font-size:27px;}

input[type="text"],input[type="password"]{width:172px;height:21px;color:#bb9d59;background-color:#f9f6d4;border:none;font-size:10px;padding-left:9px;float:left;line-height:21px;margin- bottom:14px;}
input[type="password"]{margin-left:25px;}
.links a,.links a:link{color:#943415;text-decoration:none;float:left}
.links{clear:both;border:#000 thin groove;overflow:hidden;}
.links div{float:left;}

http://jsfiddle.net/eb2zR/

最佳答案

  • overflow: hidden 应用于 form
  • forminputmargin 移动到 form 本身。

参见: http://jsfiddle.net/eb2zR/1/

关于html - 我该如何解决这个 IE7 margin 问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6596249/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com