Javascript 引导3窗体控件未堆叠

有人能检查一下这个代码吗，我真的不知道我做错了什么

我正在使用T3Blank和Twitter Bootstrap3创建此表单

由于某些原因，字段未与表格grouo div with堆叠，打印如下：

任何帮助都将不胜感激

这是表格的代码

<div class="row">
    <div class=" col-lg-6 col-md-6 col-sm-12 col-xs-12">
        <div class="well sombra-externa">
            <div class="fonte-main"><h4>Complete seu cadastro!</h4></div>
            <legend></legend>
            <form id="completar-cadastro" class="form-horizontal clearfix">
            <fieldset>
                <div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="fisica"><input name="tipopessoa" value="fisica" id="fisica" type="radio"> Pessoa Física</label>
                </div>
                <div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="juridica"><input name="tipopessoa" value="juridica" id="juridica" type="radio"> Pessoa Jurídica</label>
                </div>
                <div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="nomecliente">Nome *</label><input name="nomecliente" class="form-control" value="" placeholder="Seu nome completo" id="nomecliente" type="text">
                </div>
                <div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="cpf">CPF *</label><input name="cpf" value="" placeholder="Insira seu CPF" id="cpf" type="text" class="form-control">
                </div>
                <div class="form-group col-lg-2 col-md-2 col-sm-2 col-xs-2">
                    <label for="cpf">DDD *</label><input name="ddd" class="form-control" value="" placeholder="DDD" id="ddd" type="text">
                </div>
                <div class="form-group col-lg-4 col-md-4 col-sm-4 col-xs-4">
                    <label for="cpf">Telefone *</label><input class="form-control" name="telefone" value="" placeholder="Insira seu CPF" id="telefone" type="text">
                </div>
                <div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="cpf">CEP *</label><input name="cep" value="" class="form-control" placeholder="Insira seu CEP" id="cep" type="text">
                </div>
                </fieldset>
            </form>
        </div>
    </div>
    <div class=" col-lg-6 col-md-6 col-sm-12 col-xs-12">
        <div class="well sombra-externa">colocar passos</div>

    </div>
</div>

完成seu卡达斯托！
佩索阿费西卡酒店
佩索阿朱里迪卡酒店
诺姆*
中央公积金*
DDD*
电传*
CEP*
科罗卡·帕索斯

如果要执行此操作，请使用BootstrapWayTM以下是解决方案：

您正在将每个单独的表单组包装在

col-*-6

类中。你告诉Bootstrap的不仅是“堆叠这些项目”，而且是“将这些项目视为一行中的列并以内联方式显示”。你应该选择其中一个

看看我在这个JSFIDLE中做了什么：

在这里，您可以看到我已将您要堆叠在一列中的前四个项目包装到它们自己的列中：

<div class="col-xs-6">
  <div class="form-control">...</div>
  <div class="form-control">...</div>

...
...

。。。等等

---

如果将两列相邻放置，它们都将显示为堆叠，并且每个列都位于各自的列中。哦，还有，如果在所有屏幕尺寸上使用相同的列宽，则不需要放置

.col lg-*col super large-*…等。因为引导首先是移动的，
col-xs-6
就足够了。
如果您希望字段之间有干净的间距，我只需要从每个div中删除
表单控件
类，因为它们不是必需的，然后为堆叠的div添加一些边距：

<div class="row">
    <div class=" col-lg-6 col-md-6 col-sm-12 col-xs-12">
        <div class="well sombra-externa">
            <div class="fonte-main"><h4>Complete seu cadastro!</h4></div>
            <legend></legend>
            <form id="completar-cadastro" class="form-horizontal clearfix">
            <fieldset>
                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="fisica"><input name="tipopessoa" value="fisica" id="fisica" type="radio"> Pessoa Física</label>
                </div>
                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="juridica"><input name="tipopessoa" value="juridica" id="juridica" type="radio"> Pessoa Jurídica</label>
                </div>
                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="nomecliente">Nome *</label><input name="nomecliente" class="form-control" value="" placeholder="Seu nome completo" id="nomecliente" type="text">
                </div>
                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="cpf">CPF *</label><input name="cpf" value="" placeholder="Insira seu CPF" id="cpf" type="text" class="form-control">
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                    <label for="cpf">DDD *</label><input name="ddd" class="form-control" value="" placeholder="DDD" id="ddd" type="text">
                </div>
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                    <label for="cpf">Telefone *</label><input class="form-control" name="telefone" value="" placeholder="Insira seu CPF" id="telefone" type="text">
                </div>
                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                    <label for="cpf">CEP *</label><input name="cep" value="" class="form-control" placeholder="Insira seu CEP" id="cep" type="text">
                </div>
                </fieldset>
            </form>
        </div>
    </div>
    <div class=" col-lg-6 col-md-6 col-sm-12 col-xs-12">
        <div class="well sombra-externa">colocar passos</div>

    </div>
</div>


在您的站点上，您在
template.css
和
bootstrap.css
中都定义了以下内容：

@media screen and (min-width: 768px)
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .inputbox {
   width: auto; 
}

您应该删除它，因为它会导致上述问题。
Fiddle有助于调试。就是这样，但由于某些原因，我的表单没有以正确的宽度堆叠，因为您可以看到字段的类表单控件没有正确应用，这里是已编辑的链接-问题在于您的自定义CSS。您还应该将
class=“col-lg-6 col-md-6 col-sm-6 col-xs-6”
简化为
class=“col-xs-6”
。
@media screen and (min-width: 768px)
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .inputbox {
   width: auto; 
}