[![Input text field in form](https://i.stack.imgur.com/iFwX9.jpg)](https://i.stack.imgur.com/iFwX9.jpg)

Hi,

How do I align the input field such that they start on the same vertical line? Is there a CSS method I can use instead of manually editing each input field?

This is the html code:

```
 <form id="survey-form"> 
    <div id="form-group"> 
      <label for="name" id="name-label"> Name: </label> 
      <input type="text" id="name" name="name" placeholder="full name" required></input><br> 
    </div> 

    <div id="form-group"> 
      <label for="email" id="email-label"> Email: </label> 
      <input type="email" id="email" name="email" placeholder="validated email" required></input><br> 
    </div>

    <div id="form-group"> 
      <label for="number" id="number-label"> Contact: </label>
      <input type="number" id="number" name="contact" min="00000000" max="99999999" placeholder="phone number"></input><br> 
    </div>
 </form>

```

For CSS, I currently only have:

```
input {
  margin-bottom: 15px;
  width: 10%;
}

```

I was wondering how I can code it in CSS such that the text input fields align? For example, if I use padding the text fields will still not aligned as the length of the label differs.