Bootstrap Drupal 中的水平表单

Question

Drupal 7，Bootstrap 主题

我正在尝试制作水平表格。标签有 .form-horizontal class 标签有 .form-control class。但是，表单仍然以换行符呈现。唯一的区别是左右填充额外的 15px (?)

请查看非常短的页面：http://ovaj.link/

谢谢！

Answer 1

你的 bootstrap 形式 html 的语法是错误的，输入需要被一个 div 包围并且有一个大小，标签也需要一个大小，否则 Bootstrap 作为一个很棒的框架，无法弄清楚你想要它们的大小（假设标签 = col-sm-2 和 div = col-sm-10，目标是达到 12一条线）。例如，您的第一个字段应遵循此 html 结构：

<div class="form-group form-item form-item-long-url form-type-textfield"> 
  <label for="edit-long-url" class="control-label col-sm-2">Enter long URL: </label>
  <div class="col-sm-10">
    <input type="text" maxlength="255" size="60" value="http://" name="long_url" id="edit-long-url" class="form-control col-sm-10 form-text" tabindex="1">
  </div>
</div>

遵循文档示例：http://getbootstrap.com/css/#forms-horizontal

Bootstrap Drupal 中的水平表单

Bootstrap horizontal form in Drupal

drupal

drupal-7

twitter-bootstrap