html - 如何确保我的文本和文本框水平对齐？

Question

什么是确保我的文本和文本框在所有屏幕尺寸上正确排列的快速简便的方法？

Answer 1

<style>
 form {display:table;}
 label {display:table-row}
 label span , input {display:table-cell;}
</style>

<form>
 <label>
  <span>Name:</span>
  <input type="text" name="Name"/>
 </label>
 <label>
  <span>Phone:</span>
  <input type="text" name="Phone"/>
 </label>
</form>

适用于 IE8 及更高版本