对齐在Firefox上不起作用答案

【问题标题】：Alignment Not working on firefox对齐在Firefox上不起作用
【发布时间】：2012-08-26 06:35:38
【问题描述】：

纵横对齐和高度百分比在 Firefox 中无法正常工作虽然它在 IE 和 Chrome 上工作正常我在 html 和 body 中将高度和宽度设置为 100%

html,body { heigh:100% ; width:100% }

我尝试了所有可能的解决方案，例如text-align: -moz-center; display:block; 这是我的代码

<table cellpadding="0" cellspacing="0" border="0" style="width: 100%; height: 93%;">
    <tr style="height: 42px; width: 100%">
        <td style="width: 80px; background-image: url(Images/logo.png); background-repeat: no-repeat;
            height: 42px;">
        </td>
        <td style="height: 42px">
        </td>
    </tr>
    <tr align="center" valign="middle">
        <td style="height: 196px;" align="center" valign="middle">
            <table class="partTable" style="padding-bottom: 20px">
           <tr>
                    <td align="center" style="font-size: xx-large; font-family: Arial Black; color: #C11B17">
                        <span>
                            <%=System.Configuration.ConfigurationManager.AppSettings["AppName"]%>
                        </span>
                    </td>
                </tr>
            </table>
            <table border="0" style="text-align: -moz-center; vertical-align: middle; display: block;
                margin: 0 auto;">
                <tr>
                    <td valign="middle" class="partHolder" style="width: 314px; height: 201px;">
                 --Content
                    </td>
                </tr>
            </table>
    </tr>

注意：表格不占页面的 93%。它需要像自动一样。当我将<!DOCTYPE html> 放在 html 标记之前时，就会发生这种情况

【问题讨论】：

margin:0px auto 使您的表格居中。顺便说一句height 93% 对我来说很好......

标签： html css firefox

【解决方案1】：

使用样式margin:0 auto 使您的表格居中。
确保表格的所有容器高度：100%；例如：
- this will work
- this won't work - 和 here 是解决方法

而且你的代码有一些不便之处：

<tr style="height: 42px; width: 100%">
           ^^^^^^^^^^^^ this is ok
   </tr>
   <tr align="center" valign="middle">
       <td style="height: 196px;">
                  ^^^^^^^^^^^^^^ 
                 This is wrong. you should 
                 remove it to make table auto-risze. 
                 And you should use `height` only to <tr>

它需要像汽车一样。当我放 html标签之前

如果你使用height:93% 然后你使用height:42px,height:196px 来表示行，Firefox 就会发疯。我相信当您使用<!DOCTYPE html> 标签时，Firefox 正在使用更严格的方法来呈现 HTML+CSS

另外.. 不要将text-align 用于table,tr - 因为它们不包含任何文本。仅用于td

【讨论】：

height:93% 和垂直对齐的问题解决了，但水平对齐仍然存在。谢谢您的回复
我想将第一个 tr 左对齐，第二个居中
<td style="text-align:left;">, <td style="text-align:center;">。切勿将text-align 用于<tr>、<table>
td 里面有 2 个表格，就像问题
让我们continue this discussion in chat