1
所以我試圖用bootstrap網格創建一個簡單的響應表單，但對我來說這非常棘手。你可以忽略我發佈的大部分內容（初學者的Coldfusion，是多餘的），但要注意網格類。Bootstrap網格佈局：輸入在中途點擴展100％寬度
<div id="custom-wrapper">
<div class="row">
<div class="col-lg-12">
<h1>Create Definitions</h1>
<div style="#display#" class="error-box alert alert-#alert#">#alertMsg#</div>
</div>
<!-- /.col-lg-12 -->
<div class="row">
<div class="panel panel-default">
<div class="panel-body">
<div class="row">
<div class="col-lg-10">
<form class="form-horizontal" id="addDef" action="index.cfm?group=#URL.group#" method="POST">
<div class="form-group"> <!--- state select --->
<label for="state" class="col-lg-3 control-label">Assign to State:</label>
<div class="col-lg-7">
<select id="states" name="states" class="form-control">
<cfloop query="state">
<option value="#state.ID#" name="state">#state.StateName#</option>
</cfloop>
</select>
</div>
</div>
<div class="form-group"> <!--- state select --->
<label for="sluglist" class="col-lg-3 control-label">Assign to Question:</label>
<div class="col-lg-7">
<select id="slugList" name="slugs" class="form-control">
<option selected>--- Choose a Slug ---</option>
<cfloop query="questions">
<option value="#questions.ID#" name="state">#questions.slug#</option>
</cfloop>
</select>
</div>
</div>
<div class="form-group" id="xhrHidden" style="display:none"> <!--- question text --->
<label for="term" class="col-lg-3 control-label">Question Text:</label>
<div class="col-lg-7">
<span id="questionText"></span>
</div>
</div>
<div class="form-group"> <!--- rich text div for definition --->
<label for="term" class="col-lg-3 control-label">Text Entry:</label>
<div class="col-lg-7">
<textarea name="term" id="term"></textarea>
<div>Define a term or phrase on a state by state basis.</div>
</div>
</div>
<div class="form-group"> <!--- group select --->
<label for="state" class="col-lg-3 control-label">Group: #group.GroupName#</label>
<div class="col-lg-7">
<div>#group.GroupName#</div>
</div>
</div>
<div class="form-group"> <!--- submit button --->
<label for="submit" class="col-lg-3 control-label"></label>
<div class="col-lg-7">
<input type="submit" class="btn btn-primary" id="submitbutton" value="Create Definition" />
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
會發生什麼事是他們在大約一半的屏幕尺寸開始了，當你縮小你的瀏覽器，網格收縮，然後突然，在50％左右，投入擴大到什麼樣子寬度爲100％ ，然後下一個媒體查詢開始並進入正常大小。
有人可以解釋爲什麼我的網格會在大約中點處擴展嗎？
基本上我在使用網格時遇到了問題，甚至在我的元素上都有寬度，但它看起來像元素不應該是網格的100％，否則它會佔用整個頁面並且很難看。