css - 如何水平对齐编辑文本区域

Question

在下面发布的 HTML 代码中，如何使两个编辑文本水平对齐。

html：

<form action="/action_page.php">
  <label for="originLngLabel">origin Longitude:</label>
  <input type="text" id="originLngTextId" name="originLngText"><br><br>
  <label for="originLatLabel">origin Latitude:</label>
  <input type="text" id="originLatTextId" name="originLatText"><br><br>
  <input type="submit" value="Meaure Distance">
</form>

屏幕截图：

标签： css

Answer 1

你的意思是这样吗？去掉 br 代码，使它们水平对齐。

<form action="/action_page.php">
  <span class="addClassHere" style="margin-right:10px">
     <label for="originLngLabel">origin Longitude:</label>
     <input type="text" id="originLngTextId" name="originLngText">
   </span>
  <span class="addClassHere">
      <label for="originLatLabel">origin Latitude:</label>
      <input type="text" id="originLatTextId" name="originLatText">
  </span>
  <input type="submit" value="Meaure Distance">
</form>