我查看了几个网站的帖子，包括stackoverflow，但没有看到类似我的问题。
我有一个页面，其中包含一些div容器，用于分隔输入框并使它们看起来很好。
问题是：虽然在Safari / Opera / Chrome上看起来一切正常，但在Firefox上，框变得奇怪。
我发布了正确的HTML和CSS部分以及完成页面的URL和右侧和错误版本的图片。
如果有人能够澄清一般性错误，让我避免将来出现此类问题，我会很高兴。
谢谢您的阅读 :)
我有一个页面，其中包含一些div容器，用于分隔输入框并使它们看起来很好。
问题是：虽然在Safari / Opera / Chrome上看起来一切正常，但在Firefox上，框变得奇怪。
我发布了正确的HTML和CSS部分以及完成页面的URL和右侧和错误版本的图片。
如果有人能够澄清一般性错误，让我避免将来出现此类问题，我会很高兴。
谢谢您的阅读 :)
<div id="inner_content_big">
<div style="width: 900px; margin: 0 auto; ">
<div class="box_login_banner">
<h1>Login, Welcome :]</h1>
</div>
<div style=" clear: both; "></div>
<div class="box_login_container">
<?
$data_form['class'] = 'form_login';
?>
<?= form_open( 'user/login', $data_form ); ?>
<div class="box_login_inputs">
<div id="input_container">
<div id="input_label">
<h4>Email</h4>
</div>
<input type="input" name="login_username" id="login_special_input" class="validate[required,length[0,100]]" />
<div id="input_hint">
<h5>This is the address you specified while registering.</h5>
</div>
</div>
</div>
<div style="clear: both;"></div>
<div class="box_login_inputs">
<div id="input_container">
<div id="input_label">
<h4>Password</h4>
</div>
<input type="password" name="login_password" id="login_special_input" class="validate[required,length[0,100]]" />
<div id="input_hint">
<h5>Please remember that the password is <u>case sensitive</u>.</h5>
</div>
</div>
</div>
<?= form_close(); ?>
</div>
<div class="box_login_right">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in voluptate velit esse cillum dolore eu fugiat nulla pariatur laborum.
</div>
<div style="float: left; ">
<a class="css_button steelblue" href="#" id="button_submit">
<span>Login</span>
</a>
<a class="css_button pink" href="#download" id="button_forgot_password">
<span>Forgot your Password?</span>
</a>
</div>
<div style="float: right; margin-right: 6px; ">
<a class="css_button orange" href="#" id="button_no_account">
<span>No account?</span>
</a>
</div>
<?php if ( @$error_message != '' ): ?>
<div class="redcssboxes box_login_infobox">
<p>
<img src="<?= base_url(); ?>images/header/error.png" />
<?= $error_message; ?>
</p>
</div>
<?php endif ?>
</div>
.box_login_banner {
float: left;
margin-left: -26px;
width: 939px;
height: 50px;
border-bottom: 1px solid #DDD;
}
.box_login_banner h1 {
font-size: 28px;
color: #888;
margin-left: 30px;
margin-top: -12px;
}
.box_login_container {
float: left;
margin-top: 40px;
height: 200px;
width: 440px;
}
.box_login_right {
float: right;
margin-top: 40px;
margin-right: 14px;
height: 200px;
width: 420px;
}
.box_login_inputs {
width: 888px;
height: 100px;
margin-top: -26px;
margin-right: 0px;
}
.box_login_container #input_label {
margin-left: 4px;
width: 300px;
height: 30px;
}
.box_login_container #input_label h4 {
color: #888;
font-weight: bold;
}
.box_login_container #input_container {
float: left;
margin-top: 10px;
margin-left: 20px;
width: 400px;
height: 120px;
}
.box_login_container #input_container input {
margin-top: -5px;
}
.box_login_container #input_hint {
margin-top: -10px;
margin-left: 4px;
width: 100%;
height: 20px;
}
.box_login_container #input_hint h5 {
font-size: 12px;
color: #999;
}
#login_special_input {
color: #777;
font-size:26px;
width:97%;
margin-top:2px;
margin-right:6px;
margin-bottom:16px;
border:1px solid #e5e5e5;
background:#fbfbfb;
padding:3px;
}