标准固定工作台宽度

时间:2011-02-04 20:56:41

标签: asp.net html xhtml w3c

是否有一种标准方法可以计算HTML中表格的固定宽度值?现在,我正在将网页上的表格格式化为固定宽度,我有一个表在另一个表中,当在IE中测试页面时我注意到冒号的对齐关闭,如下面的第二张图片说明。我的目的是确保冒号在Firefox中正确对齐,如果错位是由HTML中的设置引起的,或者它与浏览器呈现页面的方式有关,那只是好奇。

火狐: enter image description here

Internet Explorer:

enter image description here

更新:

很抱歉没有提供任何参考代码,这里是我正在使用的特定部分的片段。

<div style="width: 1600px; text-align: center; position: absolute; top: 10%; left: 0%;">
    <span id="labelInstructions" style="font-size: xx-large;">PAGE TITLE <br><br></span>
    <table style="width: 1000px;" align="Center" border="0">
        <tbody>
            <tr>
                <td style="width: 1000px;"><label for="FileUpload1" style="font-size: x-large;">ENTER: </label><input name="FileUpload1" id="FileUpload1" size="70%" type="file"></td>
            </tr>
            <tr>
                <td style="width: 1000px;"><span id="fileUploadError" style="color: Red; font-size: medium;"><br><br></span></td>
            </tr>
            <tr>
                <td style="width: 1000px;">
                <table style="width: 1260px;" border="0">
                    <tbody>
                        <tr>
                            <td style="font-size: x-large; width: 800px;" align="right" valign="top">FILE INSTRUCTIONS:</td>
                            <td style="font-size: x-large; width: 1800px;" align="left" valign="top">INSTRUCTION 1<br>INSTRUCTION 2<br></td>
                        </tr>
                        <tr>
                            <td></td>
                        </tr>
                        <tr>
                            <td style="font-size: x-large; width: 800px;" align="right" valign="top">FILE EXAMPLE:</td>
                            <td style="font-size: x-large; width: 1800px;" align="left" valign="top">EXAMPLE 1<br>EXAMPLE 2<br><br></td>
                        </tr>
                    </tbody>
                </table>
                </td>
            </tr>
        </tbody>
    </table>
</div>

我知道这很难看,只是一个注释,这是一个ASP.Net生成的网页,我正在从后面的代码中以编程方式设置HTML元素的属性。我继承了这一点,我的雇主希望将重大变化保持在最低限度。

更新2:

当我调整内部表格宽度时,我可以在设置为1377px时在IE中对齐它。对于Firefox,对齐的最佳位置是1260px。

4 个答案:

答案 0 :(得分:0)

很抱歉没有直接回答你的问题,但是......

Stoneage结束了!你真的不应该使用Table进行布局,因为它们对于残疾人来说几乎不可访问,并且使你的HTML文件太大(与内容有关)。

单独的内容和布局,使用CSS

答案 1 :(得分:0)

您所要做的就是使表格列的宽度相同。

风格示例:

table tr td:first-child { background-color:yellow; width:200px; }

HTML:

<table>
  <tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></tr>
  <tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></tr>
  <tr><td>Row 3 Cell 1</td><td>Row 3 Cell 2</td></tr>
</table>

答案 2 :(得分:0)

确保将要对齐的部分放在一个表格中。

<table id="layout">
    <tr><td>HEADER</td>
    <tr><td>
        <table id="form">
            <tr><td>LABEL</td><td>INPUT FIELD</td></tr>
            <tr><td>LABEL</td><td>INPUT FIELD</td></tr>
            <tr><td>LABEL</td><td>INPUT FIELD</td></tr>
        </table>
    </tr>
    <tr><td>FOOTER</td>
</table>

答案 3 :(得分:0)

我会创建两个类leftright,并将左侧课程应用于左侧的<td>,将右侧课程应用于右侧的<td>。左边的类就像是

.left{width:100px; text-align:right;}

heres an example