@The_KEK

Как лучше сверстать такой input?

Во всем макете есть такие кнопки и как ее нормально впихнуть в input?

61fcbd7543602030570693.png
  • Вопрос задан
  • 180 просмотров
Решения вопроса 2
EPIDEMIASH
@EPIDEMIASH
Человек швейцарский нож
НУ например так

<form>
    <div class="search">
     <input type="search" name="q">
     <input type="submit" value="Subscribe">
   </div>
  </form>


.search {
    border: 1px solid #000; 
    min-height: 20px; 
    padding:4px;
    border-radius:8px;
    display: flex;
    justify-content: space-between;
   }
   
input[type="search"] {
    border: none; 
    outline: none; 
    -webkit-appearance: none; 
    flex-grow: 2;
   }
   
input[type="submit"] {
    border: none; 
    height:40px;
    background: #2e6eff; 
    border-radius: 8px;
   }
Ответ написан
Комментировать
@archelon
кнопка абсолютом поверх input
https://jsfiddle.net/ntf05zsp/
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
26 апр. 2024, в 13:47
1000 руб./за проект
26 апр. 2024, в 13:40
4000 руб./за проект
26 апр. 2024, в 13:39
500 руб./за проект