三个浏览器中的两个显示我的网页正确。到底是怎么回事?

时间:2014-09-10 10:06:36

标签: html twitter-bootstrap

此处的第一张图片显示了如何呈现网页(Chromium和Konqueror正确显示) How it is supposed to be shown 然而,这是Iceweasel如何显示它: enter image description here

以下是表单部分的网页代码。

    <div class="container">
      <div class="form-group col-lg-6">

    <form action="" method="post" name="newproyectform" class="form">     
      <div class="form-group">
        <label for="pname" class="control-label col-xs-12">Nombre del nuevo proyecto</label>
          <div class="input-group">
          <input type="text" class="form-control" name="pname" id="pname">
          <span class="input-group-btn"> <button type="button" onclick="addNewProyect('msg_cont','pname')" class="btn btn btn-primary" >Agregar nuevo proyecto</button> </span>
          </div>
          <div class="container form-group col-lg-12" id="pname_msg"></div>
      </div>          
    </form>


    <form action="" method="post" name="newproyectform" class="form">     
      <div class="form-group">
        <label for="pname" class="control-label col-xs-12">Proyectos actuales</label>
          <div class="input-group">

          <select name="states" class="form-control" id="pname_del">
        <!--Se rellena con una función de js-->
          </select>

          <span class="input-group-btn"> <button type="button" onclick="" class="btn btn btn-primary" >Borrar proyecto</button> </span>
          </div>
          <div class="container form-group col-lg-12" id="pname_del_msg"></div>
      </div>          
    </form>

      </div>

为什么会这样?这是一个iceweasel bug吗?或者我做错了什么?据我所知,我正在使用标准的bootstrap代码

1 个答案:

答案 0 :(得分:1)

您正在使用引导网格系统和表单元素完全错误。请仔细看看如何使用它以及类的嵌套。

以下是具有适当标记的代码:

<div class="container">
  <div class="row">
      <div class="col-lg-6">
        <div class="row">
          <div class="col-lg-12">


    <form action="" method="post" name="newproyectform" class="form">     
      <div class="form-group">
        <label for="pname" class="control-label">Nombre del nuevo proyecto</label>
          <div class="input-group">
          <input class="form-control" name="pname" id="pname" type="text">
          <span class="input-group-btn"> <button type="button" onclick="addNewProyect('msg_cont','pname')" class="btn btn-primary">Agregar nuevo proyecto</button> </span>
          </div>
          <div id="pname_msg"></div>
      </div>          
    </form>


    <form action="" method="post" name="newproyectform" class="form">     
      <div class="form-group">
        <label for="pname" class="control-label">Proyectos actuales</label>
          <div class="input-group">

          <select name="states" class="form-control" id="pname_del">
        <!--Se rellena con una función de js-->
          </select>

          <span class="input-group-btn"> <button type="button" onclick="" class="btn btn btn-primary">Borrar proyecto</button> </span>
          </div>
          <div id="pname_del_msg"></div>
      </div>          
    </form>
          </div>
        </div>
      </div>
  </div>
</div>

Working Bootply