将col-md-6 div推到下一行

Question

我有以下布局：

我希望突出显示的div移动到下一行，就在“座位数”的正下方，所以我想添加一个“col-md-offset-6”就可以了。但结果如下：

代码：

take_screenshot(Scenario_1, driver);

public void take_screenshot(Scenario s,WebDriver driver)
{
    final byte[] screenshot = ((TakesScreenshot) driver).getScreenshotAs(OutputType.BYTES);
    s.embed(screenshot, "image/png");
}

这样做的正确方法是什么？

Answer 1

您可以使用行归类div，如下所示

<div class="row">
   <div id="city" class="col-md-6"></div>
   <div id="country" class="col-md-6"></div>
   .
   .
   .
   <div id="NumberOfSeats" class="col-md-6"></div>
</div>
<div class="row">
   <div id="LocationProfiles" class="col-md-6"></div>
</div>

Answer 2

<div class="row">
   <div class="col-md-6"> City </div>
   <div class="col-md-6">country</div>
</div>
<div class="row">
   <div class="col-md-6"> Street Name</div>
   <div class="col-md-6">Zip Code</div>
</div>  
<div class="row">
   <div class="col-md-6"> Email</div>
   <div class="col-md-6">Phone</div>
</div>  .
<div class="row">
   <div class="col-md-3">Number Of seat</div>
   <div class="col-md-3">Terrace</div>
   <div class=col-md-6"></div>`**...(optional)**`
</div>
<div class="row">
   <div class="col-md-6">Location profile</div>
</div>

这是使用bootstrap构建此表单的正确方法。

Answer 3

在最后一个位置配置文件中，只需添加css clear：left;