2013-07-18 49 views
0

我有我的保证金:0自动在Chrome中看起来不错,但它不在IE9中工作。在IE9中,整个网站在屏幕左侧是静态的。我根据一些建议添加了一个简单的重置CSS语句,但他们没有帮助。margin:0 auto;在IE9与支架1

在main.css的:

html, body { 
     padding:0; 
     margin: 0; 
} 

body { 
    background-color: gray; 
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
    font-size: 12px;   
} 

.wrapper { 
    width: 1009px; 
    background-color:white; 
    border-style:solid; 
    border-color:#002663; 
    padding:5px; 
    margin: 0 auto; 
    margin-top:25px; 
} 

更新:CSS的看起来像在IE的开发工具面板什么:

enter image description here

任何人都可以看到我可以使IE浏览器的改进?谢谢。

更新:实际的要求HTML:

<html> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<head> 
    <title>Search Page</title> 
    <!-- Hostname: VDDP03A-FAEF32A --> 
    <link rel="stylesheet" href="/CSA/styles/main.css" type="text/css" /> 
    <link rel="stylesheet" href="/CSA/styles/smoothness/jquery-ui-1.8.10.custom.css" type="text/css" /> 
    <script type="text/javascript" src="/CSA/scripts/jquery-1.10.2.min.js" ></script> 
    <script type="text/javascript" src="/CSA/scripts/jquery-ui-1.10.3.js" ></script> 
    <script type="text/javascript" src="/CSA/scripts/jquery.validate.js" ></script> 

</head> 
<body > 
<div class="wrapper"> 
    <table width="100%" border="0" cellpadding="0" style="margin:0;"> 
    <tr> 
    <td> 
    <img src="/CSA/images/logo.jpg" width="300" align="top-left" border="0" style="margin:0;" alt="myLogo"> 
    </td> 
    <td width="50%"> 
    <br /> 
    <h2 style="font-weight:normal;align:right;color:#002663;margin:0;">Title</h2> 
    </td> 
    <td> 
    </td> 
    </tr> 
    </table> 
    <hr color="#002663" style="margin:0;"> 


<form name="form1" method="post" action="/CSA/web/CSA.do" style="margin:0;"> 
    <input type="hidden" name="searchType" value="myValue"> 
    <table width="1000px" border="0" cellpadding="0" style="margin:0;"> 
     <col width="285px" /> 
     <col width="300px" /> 
     <col width="278px" /> 
     <col width="137px" /> 

     <tr style="margin:0;"> 
      <td colspan="4"> 
       <h4 style="color:#002663;margin-bottom:10;margin-top:3;">Search 1:</h4> 
     </tr> 
     <tr style="margin:0;"> 
      <td style=" padding-left:100px; padding-bottom:0px; width:185px;" > 
      options : 
      <input type="radio" name="options" value="OP1" style="border:none;"> 
      OP1 
      <input type="radio" name="options" value="OP2" style="border:none;"> 
      OP2 

      </td> 
      <td> 
       Search Criteria&nbsp;:&nbsp;<input type="text" name="criteria" maxlength="20" size="20" tabindex="1" value="" id="searchField1"> 
      </td> 
      <td style="min-width: 268px;"> 
       Date&nbsp;:&nbsp; 
       <input type="text" name="lossDate" maxlength="10" size="11" value="07/19/2013" id="datepicker"> 


      </td> 
      <td style="min-width: 138px;"> 
       <input type="submit" name="submit" tabindex="3" value="Search" id="submit" style="margin-top:5;">&nbsp;&nbsp;&nbsp; 
       <input type="reset" name="reset" tabindex="4" value="Reset" id="reset" style="margin-top:5;"> 
      </td> 
     </tr> 
    </table> 
</form> 

<!-- Three more forms similar to the above --> 

<hr color="#b0b1b2" style="margin:3;"> 

<table table width="1000px" border="0" cellpadding="0"> 
     <tr style="margin:0;"> 
      <td style="margin:0;"> 
       <h4 style="color:#002663" style="margin-bottom:8;margin-top:3;">Search Results:</h4> 
      </td> 
     </tr> 



    <div styleId="errors" style="margin:0;"> 

    </div> 
</table> 
</div> 
</body> 
</html> 
+0

你是否以CSS重置开始? –

+2

P.S. - 这在客户端是100%,与Java或Struts无关。 –

+0

ie9可能在body标签上有默认填充或边距,请尝试将body的填充/边距设置为0 – Huangism

回答

4
<html> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

文档类型必须是的第一件事文档中加入margin:0 auto。它在<html>开始标记之前去

把它放在你拥有它的地方都是无效的,并且会触发怪癖模式(并且在怪癖模式下,各种各样的事情都会中断)。

+0

哇,这很简单。谢谢@Quentin。 –

0

尝试

body, html { 
    padding: 0; 
    margin: 0; 
} 

查一查复位CSS当你得到一个机会http://www.cssreset.com/

更新:

我会建议你采取宽度关闭身体标签并将其放入div中。

http://jsfiddle.net/KMDuw/2/

我的小提琴显示了使用自动缘固定宽度股利。如果你脱掉身体的CSS,你会看到一些空间。

你能不能也发表您的HTML请

+0

不幸的是,没有工作。我不确定我是否做得对。请参阅我的编辑。 –

+0

我试着根据您的建议进行更改。在所有浏览器中仍然看起来不错,但IE。 –

+0

可能是我现在测试的表格,它对我来说很好。我注意到你的包装上有填充物,所以会在包装和表格之间创建一个小间距。您应该能够通过IE开发工具知道是什么导致了这个空间。如果必须,请拍摄屏幕截图。这不应该很难弄清楚。确保屏幕截图捕获整个IE浏览器 – Huangism

0

尝试在你的身体标记

body { 
    /* background-position: 5px 5px; 
    background-repeat: no-repeat; */ 
    background-color: gray; 
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
    font-size: 12px; 
    width: 1010px; 
    margin: 0 auto; /* <--*/ 
} 
相关问题