Check out this form example:

display: block; -> (inputs are below labels)

block

display: inline; -> (inputs are next to labels)

inline

display: inline-block; -> (inputs are next to labels + now label width can be set and has actually effect on labels -> inputs keep the same distance to labels! HINT! make all label same width:

label { width: 500px; } )

inline-block

 

liked this article?

  • only together we can create a truly free world
  • plz support dwaves to keep it up & running!
  • (yes the info on the internet is (mostly) free but beer is still not free (still have to work on that))
  • really really hate advertisement
  • contribute: whenever a solution was found, blog about it for others to find!
  • talk about, recommend & link to this blog and articles
  • thanks to all who contribute!
admin