CODEWITHSUNDEEP
htmlcss
janne
janne

Reputation: 79

css Input boxes right below each other no matter what font size

I want these Input boxes to be right below each other, no matter what Font-Family, what font size or how the user moves the window. How is that with css possible?

enter image description here

At the moment I use the following method:

tab1 {
  padding-left: 5em;
}

That is lots of work, and if you change the text size or the fond-type you have to do it again.

Upvotes: 1

Views: 55

Answers (1)

B001ᛦ
B001ᛦ

Reputation: 2061

Use display: flex in combo with flex-direction: column:

form {
  display: flex;
  flex-direction: column;
}
<form>
  <input type="text" name="a" value="A">
  <input type="text" name="b" value="B">
  <input type="text" name="c" value="C">
  <input type="text" name="d" value="D">
</form>

Upvotes: 2

Related Questions