Как это сделать без таблиц - PullRequest
Новая
       7

Как это сделать без таблиц

0 голосов
/ 27 августа 2018

Я знаю, что это было продолжающееся обсуждение, и что с плавающей точкой: право должно быть ответом на то, чтобы избежать использования таблиц для форматирования, но я не могу понять, как сделать следующее без таблиц.Метки будут меняться в зависимости от языка, поэтому фиксированная ширина не может быть использована.

Form using Table

Мне кажется, что я не могу получить float: право на работукогда входы разной ширины.Вот HTML-код, который я использовал с таблицей ... 

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head />
<body>
    <style>
        .left {
            width:1%;
            white-space:nowrap;
            text-align:right;
            padding-right: 5px;
        }
    </style>
    <form>
        <table
            width="400">
            <tr>
                <td class="left">Name:</td>
                <td>
                    <input
                        type="text"
                        style="display:table-cell; width:100%"/>
                </td>
            </tr>
            <tr>
                <td class="left">Telephone Number:</td>
                <td>
                    <input
                        type="text" style="width: 30px;"
                    />-<input
                        type="text" style="width: 30px;"
                    />-<input
                        type="text" style="width: 40px;"/>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input
                        type="checkbox"
                    />Okay to leave the package without a signature.
                </td>
            </tr>
            <tr>
                <td valign="top" class="left">Delivery Notes:</td>
                <td>
                    <textarea
                        rows="5"
                        style="display:table-cell;
                        width:100%"
                    ></textarea>
                </td>
            </tr>
        </table>
    </form>
</body>
</html>

Спасибо.

...