Question

我附上了两张图片来展示它是如何（并且仍然在Firefox中）以及它在Chrome中的表现。我没有对这段代码进行任何更改，只是随机开始堆叠错误。

<div class="tab-content clearfix">
                                <div class="tab-pane active" id="1wheels">
                                    <form method="POST" action="wheels.php">
                                        <div class="heading">
                                            <h1>Wheel search</h1>
                                        </div>
                                        <div class="col-sm-4" >
                                            <h5>Wheel Diameter:</h5>
                                        </div>
                                        <div class="col-sm-8">
                                            <div class="select">
                                                <select name="diam">
                                                    <option value=''>SELECT</option>
                                                    <?php while ($row = mysqli_fetch_assoc($diamQuery)) : ?>
                                                        <option
                                                            value="<?php echo $row['diam']; ?>"><?php echo $row['diam']; ?></option>
                                                    <?php endwhile; ?>
                                                </select>
                                                <div class="select__arrow"></div>
                                            </div>
                                        </div>
                                        <div class="col-sm-4">
                                            <h5>Wheel PCD (mm):</h5>
                                        </div>
                                        <div class="col-sm-8">
                                            <div class="select">
                                                <select name="pcd">
                                                    <option value=''>SELECT</option>
                                                    <?php while ($row = mysqli_fetch_assoc($pcdResult)) : ?>
                                                        <option
                                                            value="<?php echo $row['pcd']; ?>"><?php echo $row['pcd']; ?></option>
                                                    <?php endwhile; ?>
                                                </select>
                                                <div class="select__arrow"></div>
                                            </div>
                                        </div>
                                        <div class="col-sm-4">
                                            <h5>Wheel Studs:</h5>
                                        </div>
                                        <div class="col-sm-8">
                                            <div class="select">
                                                <select name="holes">
                                                    <option value=''>SELECT</option>
                                                    <?php while ($row = mysqli_fetch_assoc($studResult)) : ?>
                                                        <option
                                                            value="<?php echo $row['holes']; ?>"><?php echo $row['holes']; ?></option>
                                                    <?php endwhile; ?>
                                                </select>
                                                <div class="select__arrow"></div>
                                            </div>
                                        </div>
                                        <button type="submit" class="btn btn-default btn-sm btn-primary"><i
                                                class="fa fa-pencil"></i> Search Now
                                        </button>
                                    </form>
                                </div>

                                <div class="tab-pane" id="2wheels">
                                    <form id="fitment_search" action="wheels.php" method="GET">
                                        <div class="heading">
                                            <h1>Car search</h1>
                                        </div>
                                        <div class="col-sm-4">
                                            <h5>Vehicle Make:</h5>
                                        </div>
                                        <div class="col-sm-8">
                                            <div class="select">
                                                <select name="make" onchange="get_model(this.value)">
                                                    <option value="make">SELECT</option>
                                                    <?php while ($row = mysqli_fetch_assoc($makeResult)) : ?>
                                                        <option
                                                            value="<?php echo $row['make']; ?>"><?php echo $row['make']; ?></option>
                                                    <?php endwhile; ?>
                                                </select>
                                                <div class="select__arrow"></div>
                                            </div>
                                        </div>
                                        <div class="col-sm-4">
                                            <h5>Vehicle Model:</h5>
                                        </div>
                                        <div class="col-sm-8">
                                            <div class="select">
                                                <select name="model" id="fitment_model">
                                                    <option>SELECT</option>
                                                </select>
                                                <div class="select__arrow"></div>
                                            </div>
                                        </div>
                                        <div class="col-sm-4">
                                            <h5>Wheel Diam:</h5>
                                        </div>
                                        <div class="col-sm-8">
                                            <div class="select">
                                                <select name="diam2">
                                                    <option value="diam2">SELECT</option>
                                                    <?php mysqli_data_seek($diamQuery, 0); ?>
                                                    <?php while ($row = mysqli_fetch_assoc($diamQuery)) : ?>
                                                        <option
                                                            value="<?php echo $row['diam']; ?>"><?php echo $row['diam']; ?></option>
                                                    <?php endwhile; ?>
                                                </select>
                                                <div class="select__arrow"></div>
                                            </div>
                                        </div>
                                        <button type="submit" class="btn btn-default btn-sm btn-primary"><i
                                                class="fa fa-pencil"></i> Search Now
                                        </button>
                                    </form>
                                </div>
                            </div>

我已经尝试添加一行，但这似乎没有帮助，我只是无法理解为什么会发生这种情况？它工作好几个月，突然间它开始看起来很古怪。

Answer 1

在容器类中使用网格系统。 http://getbootstrap.com/css/#grid

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title></title>
  <script src="https://code.jquery.com/jquery.min.js"></script>
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>

<body>
  <div class="container">
    <div class="tab-content clearfix">
      <div class="tab-pane active" id="1wheels">
        <form method="POST" action="wheels.php">
          <div class="heading">
            <h1>Wheel search</h1>
          </div>
          <div class="row">
            <div class="col-sm-4">
              <h5>Wheel Diameter:</h5>
            </div>
            <div class="col-sm-8">
              <div class="select">
                <select name="diam">
                  <option value=''>SELECT</option>
                  <?php while ($row=m ysqli_fetch_assoc($diamQuery)) : ?>
                  <option value="<?php echo $row['diam']; ?>">
                    <?php echo $row[ 'diam']; ?>
                  </option>
                  <?php endwhile; ?>
                </select>
                <div class="select__arrow"></div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-sm-4">
              <h5>Wheel PCD (mm):</h5>
            </div>
            <div class="col-sm-8">
              <div class="select">
                <select name="pcd">
                  <option value=''>SELECT</option>
                  <?php while ($row=m ysqli_fetch_assoc($pcdResult)) : ?>
                  <option value="<?php echo $row['pcd']; ?>">
                    <?php echo $row[ 'pcd']; ?>
                  </option>
                  <?php endwhile; ?>
                </select>
                <div class="select__arrow"></div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-sm-4">
              <h5>Wheel Studs:</h5>
            </div>
            <div class="col-sm-8">
              <div class="select">
                <select name="holes">
                  <option value=''>SELECT</option>
                  <?php while ($row=m ysqli_fetch_assoc($studResult)) : ?>
                  <option value="<?php echo $row['holes']; ?>">
                    <?php echo $row[ 'holes']; ?>
                  </option>
                  <?php endwhile; ?>
                </select>
                <div class="select__arrow"></div>
              </div>
            </div>
          </div>
          <button type="submit" class="btn btn-default btn-sm btn-primary"><i class="fa fa-pencil"></i> Search Now
          </button>
        </form>
      </div>

      <div class="tab-pane" id="2wheels">
        <form id="fitment_search" action="wheels.php" method="GET">
          <div class="heading">
            <h1>Car search</h1>
          </div>
          <div class="row">
            <div class="col-sm-4">
              <h5>Vehicle Make:</h5>
            </div>
            <div class="col-sm-8">
              <div class="select">
                <select name="make" onchange="get_model(this.value)">
                  <option value="make">SELECT</option>
                  <?php while ($row=m ysqli_fetch_assoc($makeResult)) : ?>
                  <option value="<?php echo $row['make']; ?>">
                    <?php echo $row[ 'make']; ?>
                  </option>
                  <?php endwhile; ?>
                </select>
                <div class="select__arrow"></div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-sm-4">
              <h5>Vehicle Model:</h5>
            </div>
            <div class="col-sm-8">
              <div class="select">
                <select name="model" id="fitment_model">
                  <option>SELECT</option>
                </select>
                <div class="select__arrow"></div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-sm-4">
              <h5>Wheel Diam:</h5>
            </div>
            <div class="col-sm-8">
              <div class="select">
                <select name="diam2">
                  <option value="diam2">SELECT</option>
                  <?php mysqli_data_seek($diamQuery, 0); ?>
                  <?php while ($row=m ysqli_fetch_assoc($diamQuery)) : ?>
                  <option value="<?php echo $row['diam']; ?>">
                    <?php echo $row[ 'diam']; ?>
                  </option>
                  <?php endwhile; ?>
                </select>
                <div class="select__arrow"></div>
              </div>
            </div>
          </div>
          <button type="submit" class="btn btn-default btn-sm btn-primary"><i class="fa fa-pencil"></i> Search Now
          </button>
        </form>
      </div>
    </div>

  </div>

</body>

</html>

Bootstrap无处不在，在Firefox上运行良好？

1 个答案: