Как при составлении строки «для ввода информации», сделать подчеркивание только снизу?

Question

[Karim2020]

Вообщем, хочу вот так вот оформить

Пытался разные задавать значения, но бестолку, не хватает знаний. Два скрина прикладываю для наглядности, что есть и что нужно))
P.S: Вынес плашки за рамки для понятливости. Просто нарисовать линии, не устроит, нужна именно "живая схема"

Вот что задано сейчас:
.form-input{

align-items: center;
width: 337px;

outline: none;

border: bottom 1px solid #fff;

opacity: 1;

Answer 1

[Владислав Черненко]

border: bottom ???) тире нужно вместо двоеточия.

border:0px;
border-bottom:1px solid #fff;
background:transparent;

Answer 2

[i_m]

.form-input{
border-bottom:1px solid #fff;
background:none;
}

зачем там align-items: center;   лол

Comments

[Karim2020]

Не туда действительно) Голова чуть не варит, устал.

[Ankhena]

i_m
silid -> solid
исправьте