HTML-страница с CSS и начальной загрузкой не отображает карты последовательно - PullRequest
0 голосов
/ 22 июня 2019

У меня есть базовая страница начальной загрузки и html-страница с css, и хотя первая «карта» отображается правильно, все остальные имеют разные размеры. Как ни странно, и, возможно, это ключ к решению проблемы, когда размер страницы уменьшается (например, до размера мобильного устройства), тогда все карточки имеют одинаковый размер.

Может ли кто-нибудь предложить исправление, гарантирующее, что все карты имеют одинаковый размер при полном размере страницы?

 <section class="site-hero overlay page-inside" style="background-image: url(img/thames_backdrop.jpg)">
      <div class="container">
        <div class="row site-hero-inner justify-content-center align-items-center">
          <div class="col-md-12 text-center">
            <h1 class="heading" data-aos="fade-up">Browse</h1>
            <p class="sub-heading mb-5" data-aos="fade-up" data-aos-delay="100">West End</p>
           
          </div> 
        </div>
        <!-- <a href="#" class="scroll-down">Scroll Down</a> -->
      </div>
    </section>

   
            
         <div class="card_container">
          <div class="card_row">
            <div class="col-md-12">
          <section class="room">
      <!-- Room Image -->
      <div class="room_img">
        <img src="img/11_Cadogan_Gardens.jpg">
      </div>
      <!-- Room Information -->
      <div class="room_information">
        <h2 class="room_information--heading">Hotel1</h2>
        <p>Stylish town house hotel with a member's club atmosphere.</p>
        <a href="#" class="room_information--moreinfo-btn js-room_moreinfo_btn">+ more information</a>
      </div>
      <div class="room_moreinfo js-room_moreinfo" style="display: none;">
        <p id="quote">
          Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe
          al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues coalesce, li grammatica del resultant lingue es
          plu simplic e regulari quam ti del coalescent lingues.
        </p>

        <p>
          Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues. It va esser tam simplic quam Occidental in fact, it va esser Occidental. A un Angleso it va semblar un simplificat Angles, quam un skeptic Cambridge amico dit me que
          Occidental es.Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun
          vocabules. Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles.
        </p>
      </div>
      <!-- /Room more information section-->

      <div class="room_features">
        <ul>
          <li><i class="fa fa-bath"></i>&nbsp;WC</li>
          <!-- Bath Icon -->
          <li><i class="fa fa-male"></i>&nbsp;1-3</li>
          <!-- People Icon -->
          <li><span class="room_features--price">170.-</span><small class="room_features--currency">CHF</small></li>
          <!-- Price -->
        </ul>
        <a href="javascript:void(0);" class="room_features--book-btn">Book Now</a>
        <!-- Book now -->
      </div>
    </section>
  </div>


<div class="card_container">
  <div class="card_row">
    <div class="col-md-12">
    <section class="room">
      <!-- Room Image -->
      <div class="room_img">
        <img src="https://s26.postimg.org/w9k7s5h89/hotel_thumb_2.jpg" />
      </div>
      <!-- Room Information -->
      <div class="room_information">
        <h2 class="room_information--heading">45 Park Lane</h2>
        <p>Dramatic art-deco styling and exceptional friendly service.</p>
        <a href="#" class="room_information--moreinfo-btn js-room_moreinfo_btn">+ more information</a>
      </div>
      <div class="room_moreinfo js-room_moreinfo" style="display: none;">
        <p>
          Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe
          al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues coalesce, li grammatica del resultant lingue es
          plu simplic e regulari quam ti del coalescent lingues.
        </p>

        <p>
          Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues. It va esser tam simplic quam Occidental in fact, it va esser Occidental. A un Angleso it va semblar un simplificat Angles, quam un skeptic Cambridge amico dit me que
          Occidental es.Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun
          vocabules. Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles.
        </p>
      </div>
      <!-- /Room more information section-->

      <div class="room_features">
        <ul>
          <li><i class="fa fa-utensils-alt">&nbsp;</i></li>
          <!-- Bath Icon -->
          <li><i class="fa fa-male"></i>&nbsp;1-3</li>
          <!-- People Icon -->
          <li><span class="room_features--price">130.-</span><small class="room_features--currency">CHF</small></li>
          <!-- Price -->
        </ul>
        <a href="javascript:void(0);" class="room_features--book-btn">Book Now</a>
        <!-- Book now -->
      </div>
    </section>
  </div>
  <!-- /row-->
</div>
<!-- /container -->   

<!-- New card -->

<div class="card_row">
    <section class="room">
      <!-- Room Image -->
      <div class="room_img">
        <img src="https://s26.postimg.org/w9k7s5h89/hotel_thumb_2.jpg" />
      </div>
      <!-- Room Information -->
      <div class="room_information">
        <h2 class="room_information--heading">45 Park Hotel</h2>
        <p>Dramatic art-deco styling and exceptional friendly service.</p>
        <a href="#" class="room_information--moreinfo-btn js-room_moreinfo_btn">+ more information</a>
      </div>
      <div class="room_moreinfo js-room_moreinfo" style="display: none;">
        <p>
          Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe
          al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues coalesce, li grammatica del resultant lingue es
          plu simplic e regulari quam ti del coalescent lingues.
        </p>

        <p>
          Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues. It va esser tam simplic quam Occidental in fact, it va esser Occidental. A un Angleso it va semblar un simplificat Angles, quam un skeptic Cambridge amico dit me que
          Occidental es.Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun
          vocabules. Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles.
        </p>
      </div>
      <!-- /Room more information section-->

      <div class="room_features">
        <ul>
          <li><i class="fa fa-bath"></i>&nbsp;WC</li>
          <!-- Bath Icon -->
          <li><i class="fa fa-male"></i>&nbsp;1-3</li>
          <!-- People Icon -->
          <li><span class="room_features--price">130.-</span><small class="room_features--currency">CHF</small></li>
          <!-- Price -->
        </ul>
        <a href="javascript:void(0);" class="room_features--book-btn">Book Now</a>
        <!-- Book now -->
      </div>
    </section>
  </div>
  <!-- /row-->
</div>

<!-- New card -->
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...