html - firefox中某些元素的错误位置

Question

我做这个website但有一个问题。当我针对平板电脑或移动设备测试网站时，关于我们图片的位置是错误的。当然这张图片目前在 chrome 中显示，但在 ff 中没有。请指教

Answer 1

在您的网站中，标记存在问题，这就是它发生的原因。

用我的关于部分的标记替换希望它会起作用。查看关于我们部分的标记和新添加的标记。

问题你首先调用了一个container和row about us section in this container you include col-md-12,col-md-8,col-md-4 但它不是 bootstrap 的有效标记。您可以调用两个 row 一个是 include col-md-12 其他 row 包括 col-md-8,col -md-4 那么它将完美地工作。

<div class="container">
  <div class="row row-bottom-padded-lg inverse animated" id="about-us">
    <div class="col-md-12 section-heading text-center ">
      <h2 class="to-animate fadeInUp animated">About Us</h2>
      <!--    <div class="row">
                        <div class="col-md-8 col-md-offset-2 to-animate">
                            <h3>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.</h3>
                        </div>
                    </div>-->
    </div>
    <div class="col-md-8 to-animate fadeInUp animated">
      <img src="images/Sahand-Industrial-Group-Site_1400_638.jpg" class="img-responsive  img" alt="Free HTML5 Template">
    </div>
    <div class="col-md-4 to-animate fadeInUp animated">
      <h2>sahand Industrial Group</h2>
      <p>Sahand Industrial Group with using of world last technology and worldwide highest quality has started to produce variety of white and color glasses such as float, patterned, reinforced, mirror, etc... And regarding its exclusive facilities is able
        to produce reinforced patterned glass too.</p>
      <p>Sahand Industrial Group includes the following factories which are acting in field of glass production and related processes.</p>
      <ol>
        <li>Azar Glass Industrial Company</li>
        <li>Sahand Mirror Tabriz Company</li>
        <li>Sahand Jam Tabriz Company</li>
        <li>Imeni Ark Tabriz</li>
        <li>Sahand Silica Tabriz</li>
        <li>Semnan Soda Ash Company</li>
        <li>Sahand Float Tabriz Company</li>
        <li>Frough Tranbar Transport Company</li>

      </ol>
    </div>
  </div>
  <div class="row" id="team">

    <div class="col-md-12">
      <div class="row row-bottom-padded-lg">
        <div class="col-md-4 text-center to-animate inverse">
          <div class="person">
            <img src="images/azarGlass-logo.jpg" class="img-responsive  img" alt="Person">

            <div class="position">Azar Glass Industry Company</div>
            <p>
              Sahand Jame Tabriz Company : producer of types of white and color patterned glasses in variety of design and sizes Nominal capacity: 200 tons per day Full description of the production method: Glass rolling method; this means that melt is poured in the
              middle of two rollers, then molten rollers is rolled, so design of bottom rollers are engraved on the glass bar.
            </p>
            <ul class="social social-circle">
              <li><a href="#"><i class="icon-twitter"></i></a>
              </li>
              <li><a href="#"><i class="icon-linkedin"></i></a>
              </li>
              <li><a href="#"><i class="icon-instagram"></i></a>
              </li>
              <li><a href="#"><i class="icon-github"></i></a>
              </li>
            </ul>
          </div>
        </div>
        <div class="col-md-4 text-center to-animate inverse">
          <div class="person">
            <img src="images/sig-2.jpg" class="img-responsive img-rounded img" alt="Person">

            <div class="position">Sahand Mirror Company</div>
            <p>This line which its technology belongs to Italy has production capacity of 5000 sq.m. in day includes 2 models: Wrinkles two-layers of and simple two-layers. Produced mirrors in addition to prepare domestic consumption, is exported to Turkey,
              Armenia and etc.</p>
            <ul class="social social-circle">
              <li><a href="#"><i class="icon-twitter"></i></a>
              </li>
              <li><a href="#"><i class="icon-linkedin"></i></a>
              </li>
              <li><a href="#"><i class="icon-instagram"></i></a>
              </li>
              <li><a href="#"><i class="icon-dribbble"></i></a>
              </li>
            </ul>
          </div>
        </div>
        <div class="col-md-4 text-center to-animate inverse">
          <div class="person">
            <img src="images/sig-3.jpg" class="img-responsive img-rounded img" alt="Person">

            <div class="position">Sahand Jame Tabriz Company</div>
            <p>
              Azar Glass Industry Company: Producer of flat glass and mirror in thickness of 12-3 mm and variety sizes. Nominal capacity: 350 tons per day (96000 tons per year) Full description of the production method: Producing flat glasses with the float method;
              in the way that the produced melt from raw materials by furnace with temperature of about 1530 °C is guided on melt tin and after forming is ready for cutting and remove.
            </p>
            <ul class="social social-circle">
              <li><a href="#"><i class="icon-twitter"></i></a>
              </li>
              <li><a href="#"><i class="icon-linkedin"></i></a>
              </li>
              <li><a href="#"><i class="icon-instagram"></i></a>
              </li>
              <li><a href="#"><i class="icon-github"></i></a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

新标记:

<div class="container">
  <div class="row row-bottom-padded-lg inverse animated" id="about-us">
    <div class="col-md-12 section-heading text-center ">
      <h2 class="to-animate fadeInUp animated">About Us</h2>
    </div>
  </div>
  <div class="row">
    <div class="col-md-8 to-animate fadeInUp animated">
      <img src="images/Sahand-Industrial-Group-Site_1400_638.jpg" class="img-responsive  img" alt="Free HTML5 Template">
    </div>
    <div class="col-md-4 to-animate fadeInUp animated">
      <h2>sahand Industrial Group</h2>
      <p>Sahand Industrial Group with using of world last technology and worldwide highest quality has started to produce variety of white and color glasses such as float, patterned, reinforced, mirror, etc... And regarding its exclusive facilities is able
        to produce reinforced patterned glass too.</p>
      <p>Sahand Industrial Group includes the following factories which are acting in field of glass production and related processes.</p>
      <ol>
        <li>Azar Glass Industrial Company</li>
        <li>Sahand Mirror Tabriz Company</li>
        <li>Sahand Jam Tabriz Company</li>
        <li>Imeni Ark Tabriz</li>
        <li>Sahand Silica Tabriz</li>
        <li>Semnan Soda Ash Company</li>
        <li>Sahand Float Tabriz Company</li>
        <li>Frough Tranbar Transport Company</li>

      </ol>
    </div>
  </div>
  <div class="row animated" id="team">

    <div class="col-md-12">
      <div class="row row-bottom-padded-lg">
        <div class="col-md-4 text-center to-animate inverse fadeInUp animated">
          <div class="person">
            <img src="images/azarGlass-logo.jpg" class="img-responsive  img" alt="Person">

            <div class="position">Azar Glass Industry Company</div>
            <p>
              Sahand Jame Tabriz Company : producer of types of white and color patterned glasses in variety of design and sizes Nominal capacity: 200 tons per day Full description of the production method: Glass rolling method; this means that melt is poured in the
              middle of two rollers, then molten rollers is rolled, so design of bottom rollers are engraved on the glass bar.
            </p>
            <ul class="social social-circle">
              <li><a href="#"><i class="icon-twitter"></i></a>
              </li>
              <li><a href="#"><i class="icon-linkedin"></i></a>
              </li>
              <li><a href="#"><i class="icon-instagram"></i></a>
              </li>
              <li><a href="#"><i class="icon-github"></i></a>
              </li>
            </ul>
          </div>
        </div>
        <div class="col-md-4 text-center to-animate inverse fadeInUp animated">
          <div class="person">
            <img src="images/sig-2.jpg" class="img-responsive img-rounded img" alt="Person">

            <div class="position">Sahand Mirror Company</div>
            <p>This line which its technology belongs to Italy has production capacity of 5000 sq.m. in day includes 2 models: Wrinkles two-layers of and simple two-layers. Produced mirrors in addition to prepare domestic consumption, is exported to Turkey,
              Armenia and etc.</p>
            <ul class="social social-circle">
              <li><a href="#"><i class="icon-twitter"></i></a>
              </li>
              <li><a href="#"><i class="icon-linkedin"></i></a>
              </li>
              <li><a href="#"><i class="icon-instagram"></i></a>
              </li>
              <li><a href="#"><i class="icon-dribbble"></i></a>
              </li>
            </ul>
          </div>
        </div>
        <div class="col-md-4 text-center to-animate inverse fadeInUp animated">
          <div class="person">
            <img src="images/sig-3.jpg" class="img-responsive img-rounded img" alt="Person">

            <div class="position">Sahand Jame Tabriz Company</div>
            <p>
              Azar Glass Industry Company: Producer of flat glass and mirror in thickness of 12-3 mm and variety sizes. Nominal capacity: 350 tons per day (96000 tons per year) Full description of the production method: Producing flat glasses with the float method;
              in the way that the produced melt from raw materials by furnace with temperature of about 1530 °C is guided on melt tin and after forming is ready for cutting and remove.
            </p>
            <ul class="social social-circle">
              <li><a href="#"><i class="icon-twitter"></i></a>
              </li>
              <li><a href="#"><i class="icon-linkedin"></i></a>
              </li>
              <li><a href="#"><i class="icon-instagram"></i></a>
              </li>
              <li><a href="#"><i class="icon-github"></i></a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>