1

Есть такой код:

<form action="" method="post">
Логин:<input type="text">
Пароль:<input type="password">
<input type="submit" value="Ok">
</form>

Результат: введите сюда описание изображения

Как делать, чтобы все ровно было? И какие есть способы выровнять?

1

3 ответа 3

3

div.field {
  padding-bottom: 5px;
}
div.field label {
  display: block;
  float: left;
  width: 70px;
  height: 15px;
}
<form action="" method="post">
  <div class="field">
    <label>Логин:</label>
    <input type="text" name="login" />
  </div>
  <div class="field">
    <label>Пароль:</label>
    <input type="password" name="password" />
  </div>
  <div class="field">
    <label></label>
    <input type="submit" value="Ok">
  </div>
</form>

2

Самый простой способ, без использования стилей: использовать таблицу.

<form action="" method="post">
  <table>
    <tbody>
      <tr>
        <td>Логин:</td>
        <td>
          <input type="text">
        </td>
      </tr>
      <tr>
        <td>Пароль:</td>
        <td>
          <input type="password">
        </td>
      </tr>
      <tr>
        <td colspan="2">
          <input type="submit" value="Ok">
        </td>
      </tr>
    </tbody>
  </table>
</form>

0

<p>Логин:<input type="text"style=position:absolute;left:12%;></p>
<p>Пароль:<input type="text"style=position:absolute;left:12%;></p>

1

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.