0

Пробовал сначала margin, но он не захотел работать, в итоге решил padding использовать и он тоже приказал долго жить. Подкажите, как выравнить этот чертов input по центру.

HTML

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Сотрудники</title>
    <link rel="stylesheet" href="main.css">
</head>
<body>
    <div class="search">
        <input type="search" id="search">
        <div class="vector1"></div>
        <div class="vector"></div>
    </div>
</body>
</html>

CSS

    background: #FFFFFF;
}

#search {
    display: block;
    box-sizing: border-box;
    position: absolute;
    width: 1180px;
    height: 52px;
    left: 400px;
    top: 53px;
    background: #FFFFFF;
    border: 1px solid #E4EEF0;
    border-radius: 50px;
}

div.vector1 {
    position: absolute;
    width: 17.78px;
    height: 17.8px;
    left: 1532px;
    top: 66px;
    border-radius: 15px;
    border: 3px solid #B049D4;
}

div.vector {
    position: absolute;
    width: 8.84px;
    height: 1.85px;
    left: 1552.16px;
    top: 88.8px;
    background: #B049D4;
    transform: rotate(45deg);
    border-radius: 2px;
    border: 1px solid #B049D4
}```

1 ответ 1

0

Вам стоит попробовать следующее решение -

position: absolute; 
  left: 0; 
  right: 0; 
  margin-left: auto; 
  margin-right: auto; 
  width: 1180px; /* Для работы нужен размер */

Я бы использовал не высоту элемента а внутренние отступы -

padding: 20px;
6
  • Спасибо, это сработало. Есть еще вопрос, как div'ы, который называются векторами переместить вправо окна ввода input? 27 июн 2022 в 10:28
  • Если это сработало для вас, отметьте пожалуйста решением
    – Daniil
    27 июн 2022 в 10:30
  • Я совершенно не понял вопроса, попробуйте переформулировать.
    – Daniil
    27 июн 2022 в 10:30
  • У меня есть лупа, которую я составил из div'ов (vector и vector1 i.imgur.com/Qcx5g2r.png), мне нужно чтобы они были в правой части, независимо от расположения input (сейчас они статичны) 27 июн 2022 в 10:33
  • Гм, а зачем составлять из дивов? Есть готовые иконки. И, учитывая, что они абсолюты, то right: 0 - должно сработать
    – Daniil
    27 июн 2022 в 10:35

Ваш ответ

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

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