Home/ Questions/Q 8021375
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T21:57:40+00:00

I have a HTML form like: <html> Name:<input type=text/></br> Email Address:<input type=text/></br> Description of

  • 0

I have a HTML form like:

 <html>
  Name:<input type="text"/></br>
  Email Address:<input type="text"/></br>
  Description of the input value:<input type="text"/></br>
 </html>

Now the labels all begin in the same column but the text boxes are beginning in different positions as per the label’s text length.

Is there a way to align the input fields such that, all the “:” and the text boxes, will begin in the same position, and the preceding text will be right aligned until the “:” ?

I am okay with using CSS if that can help achieving this.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Working JS Fiddle

    HTML:

      <div>
      <label>Name:</label><input type="text">
      <label>Email Address:</label><input type = "text">
      <label>Description of the input value:</label><input type="text">
  </div>

    CSS:

    label{
    display: inline-block;
    float: left;
    clear: left;
    width: 250px;
    text-align: right;
}
input {
  display: inline-block;
  float: left;
}
    • 0