Стандартная фиксированная ширина стола

Question

Существует ли стандартный метод расчета значений фиксированной ширины для таблиц в HTML?Сейчас я работаю над форматированием таблиц на веб-странице, чтобы они были фиксированной ширины, у меня есть таблица, которая находится в другой таблице, при тестировании страницы в IE я замечаю, что выравнивание двоеточия отключено, как показано на втором рисунке нижеиллюстрирует.Я намерен убедиться, что двоеточия правильно выровнены, как в Firefox, и мне было просто любопытно, было ли смещение связано с настройками в HTML или это больше связано с тем, как браузер отображает страницу.

Firefox:

Internet Explorer:

ОБНОВЛЕНИЕ:

Извините, что не предоставил ссылочный код, вот фрагментопределенного раздела, с которым я работаю.

<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:

Когда я настраиваю внутреннюю ширину таблицы, я могу заставить ее выравниваться в IE при значении 1377px,Для Firefox предпочтительным местом для выравнивания является 1260px.

Answer 1

Я бы создал два класса left и right и применил левый класс к <td> слева, а правый класс к <td> справа. левый класс будет что-то вроде

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

вот пример

Answer 2

Все, что вам нужно сделать, это сделать столбцы таблицы одинаковой ширины.

Пример стиля:

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>

Answer 3

Убедитесь, что детали, которые вы хотите выровнять, объединены в одну таблицу.

<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>

Answer 4

Извините, что не ответил на ваш вопрос напрямую, но ...

Stoneage окончен!Вы действительно не должны использовать таблицы для макетирования, так как они труднодоступны для людей с ограниченными возможностями и делают ваш HTML-файл слишком большим (по отношению к контенту).

Отдельный контент и макет, используйте CSS .