0

Делаю окно регистрации на сайте, и на рисунке видно, что первый текст и поле ввода смещены влево, а также слова "повтор" и "пароля" расположены на одной строчке, хоть стоит text-algin: center.

#title {
  margin-top: 40px;
  position: absolute;
  margin-left: 50%;
  transform: translateX(-50%);
  font-family: 'Russo One', sans-serif;
  font-size: 60px;
}

.ps {
  font-family: 'Russo One', sans-serif;
  margin-left: 50%;
  transform: translateX(-50%);
  position: absolute;
  margin-top: 160px;
}

.login {
  text-align: center;
  position: absolute;
  margin-top: 170px;
  margin-left: 50%;
  transform: translateX(-50%);
}

.password2 {
  text-align: center;
  position: absolute;
  margin-top: 40px;
  margin-left: 50%;
  transform: translateX(-50%);
}

.password1 {
  text-align: center;
  position: absolute;
  margin-top: 40px;
  margin-left: 50%;
  transform: translateX(-50%);
}

.d1 {
  font-size: 25px;
  font-family: 'Russo One', sans-serif;
}

.d1 input {
  display: block;
  border-color: black;
  border-style: solid;
  border-width: 3px;
}
<div class="d1">
  <span id="title">РЕГИСТРАЦИЯ</span>
  <div class="login">
    <span>Повтор пароля</span>
    <input type="text">
    <div class="password1">
      <span>Пароль</span>
      <input type="text">
      <div class="password2">
        <span>Повтор пароля</span>
        <input type="text">
      </div>
    </div>
  </div>
</div>

сайт

1 ответ 1

1

Зачем весь этот огород?

#title {
  font-size: 60px;
}

.d1 {
  font-size: 25px;
  font-family: 'Russo One', sans-serif;
  text-align: center;
}

.d1 input {
  border-color: black;
  border-style: solid;
  border-width: 3px;
}
<body>
  <div class="d1">
    <span id="title">РЕГИТРАЦИЯ</span>
    <div class="login">
      <span>Повтор пароля</span><br>
      <input type="text">
      <div class="password1">
        <span>Пароль</span><br>
        <input type="text">
        <div class="password2">
          <span>Повтор пароля</span><br>
          <input type="text">
        </div>
      </div>
    </div>
  </div>
</body>

1
  • Спасибо, теперь всё работает нормально, но я не могу заметить, что вы тут поправили.
    – Фёдор
    15 дек 2019 в 17:45

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

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