html - 以 Bootstrap 形式关闭空间

Question

我有一个 Bootstrap 表单，其中包含以下 CSS 代码。我试图通过添加 margin:0 属性来关闭表单中的空格，但元素之间的空格仍然存在。

css表单代码

<div class="row-fluid">
    <form style="width: 90%; height: 100%; margin-top:1px;" method="post"novalidate="novalidate" class="form well">


        <div class="row-fluid">
            <div>
                <label for="complaints">Message *</label>
                <textarea style="width:100%;" name="complaints" rows="3" required></textarea>
            </div>
        </div> 
        <div class="form-actions">
            <input style="width:100%; background-color:#da291c;" class="btn btn-primary" name="commit" type="submit" value="Send">
        </div>
    </form>
</div>

这是上面表格的图片

我的挑战是缩小箭头所指区域的间隙。

我正在使用这个版本的 Bootstrap

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap-combined.min.css">

Answer 1

您可以删除 bootstrap 添加到类 .control-group 的 margin-bottom

.row-fluid div.control-group, div.form-actions {
    margin-bottom: 0px;
}

div.my-form{
  padding-bottom: 0px;
  margin-top:0px;
  padding-top:0px;
}

.control-group input,.control-group textarea{
      margin-bottom: 0px;    
}

form.form{
  padding-bottom: 0;
  padding-top:0;
}

已更新 jsfiddle用你的代码