如何在Google Sheets对话框中实现文本与输入框横向排列？

要把文本放到输入框旁，需要调整HTML结构（当前结构不符合规范），搭配可选的CSS实现，以下是两种简单可行的方式：

方法一：使用表格单元格布局（适配Google Apps Script默认样式） #

当前代码里<h5>直接嵌套在<table>内不符合HTML规范，表格需通过<tr>（行）和<td>（单元格）组织内容，修正后可让标签与输入框自然并排：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  </head>
  <body>
    <div>
      <table>
        <tr>
          <td><h5>LA/LB</h5></td>
          <td><input type="text" class="form-control" id="alertLocation"></td>
        </tr>
      </table>
    </div>
  </body>
</html>

方法二：使用CSS Flex布局（更灵活自定义） #

通过Flex布局控制元素排列，可自定义标签与输入框的间距和对齐方式：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <style>
      .input-row {
        display: flex;
        align-items: center;
        gap: 10px; /* 调整标签和输入框的间距 */
      }
    </style>
  </head>
  <body>
    <div class="input-row">
      <h5>LA/LB</h5>
      <input type="text" class="form-control" id="alertLocation">
    </div>
  </body>
</html>

两种方式都能实现文本在输入框旁的效果，可根据需求选择。

内容的提问来源于stack exchange，提问作者Lofton Gentry