Css 如何将所有内容集中在2个引导列中?(col-md-6和col-md-6)?
基本上我有这样的东西Css 如何将所有内容集中在2个引导列中?(col-md-6和col-md-6)?,css,twitter-bootstrap,Css,Twitter Bootstrap,基本上我有这样的东西 <div class="container"> <div class="row"> <div class="col-md-6> <form class="form-group-sm"> <input /> <button type="submit"></button>
<div class="container">
<div class="row">
<div class="col-md-6>
<form class="form-group-sm">
<input />
<button type="submit"></button>
</form>
</div>
</div>
<div class="col-md-6>
<form class="form-group-sm">
<input />
<button type="submit"></button>
</form>
</div>>
</div>
>
两列并排排列,我试图找出一种方法,将表单、输入和按钮放在每列的中心,但似乎不太清楚如何
<form method="POST" action="./createProduct" class="form-group-sm" >
<div class="form-group">
<label for="t" class="col-md-8 control-label">Product Type</label>
<div class="col-md-8">
<input name="productType" id="t"/>
</div>
</div>
<div class="form-group">
<label for="sn" class="col-md-8 control-label">Material Cost PerSqFoot</label>
<div class="col-md-8">
<input name="matCostSqf" id="sn"/>
</div>
</div>
<div class="form-group">
<label for="snum" class="col-md-8 control-label">Labor Cost PerSqFoot</label>
<div class="col-md-8">
<input name="laborCostSqf" id="snum" />
</div>
</div>
<br />
<div class="col-md-8">
<br />
<button class=" btn btn-danger btn-lg center-block" type="submit">Submit</button>
</div>
</form>
产品类型
材料成本
人工成本
提交
Twitter引导程序有一个名为文本中心的默认类
只需将text center
类添加到col-
div中,如下所示:
<div class="col-md-6 text-center">
-- your content --
</div>
--你的内容--
p.S.您忘记正确关闭列div。请确保始终关闭它们。您的标记包含一些错误,例如额外的结束div和类属性缺少的双cotes:class=“col-md-6>
以下是您可以使用引导类“文本中心”的解决方案
提交
提交
你能检查一下我的编辑吗?文本中心几乎可以工作,但还是有点偏左。我猜这与我的表单组大小有关?等一下,让我检查一下。@BrennanBennett所以第二个表单片段在第一个片段的第一个或第二个col-md-6
中?我弄明白了。文本分呃就是我要找的。谢谢!很高兴我能帮助布伦南:)干杯!!是的,我手动把所有的都放在文本框中,哈哈,谢谢。
<div class="container">
<div class="row">
<div class="col-md-6 text-center">
<form class="form-group-sm">
<input />
<button type="submit">Submit</button>
</form>
</div>
<div class="col-md-6 text-center">
<form class="form-group-sm">
<input />
<button type="submit">Submit</button>
</form>
</div>
</div>