Проблемы выравнивания в HTML-форме - PullRequest
Новая
       2

Проблемы выравнивания в HTML-форме

1 голос
/ 12 мая 2011

У меня есть следующая форма в документе html5. Я новичок в том, что касается html и css. В основном, я пытаюсь научиться экспериментировать.лицом,

1) Мне нужно знать, как я могу контролировать расстояние между меткой и полем ввода.

2) Также пробел между двумя li (имя и фамилия).

PS: у меня также есть файл CSS, который контролирует шрифт, цвет, ширину ввода и т. Д.

Ответы [ 2 ]

2 голосов
/ 12 мая 2011

Попробуйте следующий код.

Для "ol li label" (в коде css) вы также можете использовать margin вместо width , чтобы контролировать расстояниемежду меткой и элементами ввода. 

<head>
    <style>
    ol{
        margin:0; 
        padding:0;
    }
    ol li{
        margin:0 0 10px 0; 
    }
    ol li label{
        width:150px; 
        float:left; 
    }
    ol li input{
        float:left;
    }
    </style>
</head>

<body>
    <form>
        <ol>
            <li>
                <label for="fname">First Name</label>
                <input name="fname" type="text">
            </li>
            <li>
                <label for="lname">Last Name</label>
                <input name="lname" type="text">
            </li>
            <li>
                <label for="dept">Department</label>
                <input id="dept" type="text">
            </li>
       </ol>
    </form>
</body>
0 голосов
/ 12 мая 2011

Попробуйте использовать margin-bottom и margin-top на элементах input.

См. здесь для получения дополнительной информации о полях в CSS.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...