Chrome和IE显示diffrence

我有一个表Chrome和IE显示diffrence

<tr>Page header goes here</> 
<tr valign="top"> 
     <td align="center" height="100%" valign="top"> 
      <center> 
       <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="1"> 
        <tbody> 
         <tr height="29%"> 
          <td height="29%"> 
           // to display the below tr in center of page 
          </td> 
         </tr> 
         <tr height="31%"> 
          <td bgcolor="FFFFFF" height="31%" align="center" valign="top"> 
           <table width="40%" height="31%" border="0" align="center" cellpadding="0" cellspacing="0"> 
            <tbody> 
             <tr> 
              <td width="16"> 
               <img src="@Href("~/Content/themes/base/images/top_lef.gif")" width="16" height="100%" /> 
              </td> 
              <td height="16" style="background-image: url('@Url.Content("~/Content/themes/base/images/top_mid.gif")')"> 
               <img src="@Href("~/Content/themes/base/images/top_mid.gif")" width="16" height="100%" /> 
              </td> 
              <td width="24"> 
               <img src="@Href("~/Content/themes/base/images/top_rig.gif")" width="24" height="100%" /> 
              </td> 
             </tr> 
             <tr> 
              <td width="16" style="background-image: url('@Url.Content("~/Content/themes/base/images/cen_lef.gif")')"> 
               <img src="@Href("~/Content/themes/base/images/cen_lef.gif")" width="16" height="100%" /> 
              </td> 
              <td bgcolor="#F7F8FB" valign="top"> 
               <div style="height: 30px;"> 
               </div> 
               @using (Html.BeginForm()) 
               { 
         //login details username and password 
               } 
              </td> 
              <td width="24" style="background-image:url('@Url.Content("~/Content/themes/base/images/cen_rig.gif")')"> 
               <img src="@Href("~/Content/themes/base/images/cen_rig.gif")" width="24" height="100%" /> 
              </td> 
             </tr> 
             <tr> 
              <td width="16" height="16"> 
               <img src="@Href("~/Content/themes/base/images/bot_lef.gif")" width="16" height="16" /> 
              </td> 
              <td height="16" style="background-image: url('@Url.Content("~/Content/themes/base/images/bot_mid.gif")')"> 
               <img src="@Href("~/Content/themes/base/images/bot_mid.gif")" width="16" height="16" /> 
              </td> 
              <td width="24" height="16"> 
               <img src="@Href("~/Content/themes/base/images/bot_rig.gif")" width="24" height="16" /> 
              </td> 
             </tr> 
            </tbody> 
           </table> 
          </td> 
         </tr> 
         <tr height="39%"> 
          <td height="39%"> 
           // to display the above tr in center of page 
          </td> 
         </tr> 
        </tbody> 
       </table> 
      </center> 
     </td> 
    </tr> 
    <tr>Page footer goes here</>

我添加了一个tr和TD，带20和31％以上，所述主体在我的登录控制去

@using (Html.BeginForm()) 
{ 
}

下面但在IE中，登录控件显示在中间，但在Chrome中，登录显示在页面标题之后。它似乎没有考虑到29％的高度。我试着添加
，但两种浏览器的结果都不一样。

我正在寻找一个更好的方法来解决这个问题。如果有人能帮我解决这个问题。

来源

2013-09-25 DotNetBeginner

请不要将表格用于新的网站布局。那里有很多更好的方法。请看看div's。

来源

2013-09-26 08:28:29 Ivotje50

使用表格时出现什么问题。 – DotNetBeginner

阅读此主题：http://stackoverflow.com/questions/83073/why-not-use-tables-for-layout-in-html – Ivotje50

Chrome和IE显示diffrence

回答

相关问题