Question

我正在尝试使用Google Apps脚本中的简单样式创建表单。

添加Google插件样式表时，文本输入和选择框会变得不对齐。我需要他们并肩坐在一起。

<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">

<style>

select {
width: 80%;
}

.width-10 {
width: 10%;
}

</style>


<form>
<div class="options" id="option1">

<input type="text" class="width-10" id="user-input1" value="" tabindex=8>
<select id="user-input6" tabindex=1></select><br>

<input type="text" class="width-10" id="user-input2" value="" tabindex=9>
<select id="user-input7" tabindex=2></select><br>

</div>
</form>

Answer 1

由于您使用的是Google加载项的官方样式表，因此您可以使用inline类。这将放置文本输入字段并并排选择选项列表。

<div class="inline form-group">
  <label for="email">Your email:</label>
  <input type="email" class="form-control" id="email" placeholder="you@gmail.com" value="example@gmail.com" required>
</div>

<div class="inline form-group">
  <label for="eventName">What's the topic?</label>
  <input type="text" class="form-control" id="eventName" value="App Testing" required>
</div>

您可能需要在<style>标记

中删除CSS

使用Google插件样式表错误对齐表单元素 - 并排输入框

1 个答案: