2016-11-09 3 views
1

У меня проблема с контейнером. У меня есть новости о контейнерах, и если одна новостная плитка больше, она идет в нижний колонтитул.bootstrap Контейнер работает неправильно

Как это: image here: container not working correctly

Я не найти рабочую resultion

Мой код:

<?php 
$db = mysqli_query($con, "SELECT * FROM gallery") or trigger_error("Vigane päring: " . mysqli_error($con)); 
?> 
<div class="gallery"> 
<div class="restaurant-full-width block-events row"> 
<div class="container-fluid block-events" style="width: 1230px!important;"> 
    <div class="content"> 
     <div class="wrap"> 
     <div id="main" role="main" style="min-height:1200px!important;"> 
     <h1 class="clearfix"><?php echo $lang['koikuudised']; ?></h1> 
       <ul id="tiles"> 
       <?php while($gallery = mysqli_fetch_array($db)) { 
       ?> 
       <li> 
        <figure class="effect-marley"> 
         <a title="<?php echo $gallery['gallery_thumbnail']; ?>" data-lightbox="gallery-popup" href="<?php echo $CONF['installation_path'] . $gallery['gallery_thumbnail']; ?>"> 
          <img src="<?php echo $CONF['installation_path'] . 'system/timthumb.php?src=' . $CONF['installation_path'] . $gallery['gallery_thumbnail'] . '&h=350&zc=1'; ?>" alt="<?php echo $gallery['gallery_name']; ?>" /> 
         </a> 
         <figcaption> 
         <div class="brown"> 
          <p><?php echo $gallery['gallery_name']; ?></p> 
         </div>   
         </figcaption>   
        </figure> 
       </li> 
       <?php } ?> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div> 

+0

попытка создать jsfiddle. –

+0

Можете ли вы дать «bage background div» (основной контейнер) в вашем изображении стиль 'overflow: auto' & let me know. * PS: Совместное использование стилей поможет вам получить ответ * –

+0

@NikhilNanjappa overflow: auto; сделает его прокруткой –

ответ

0

Для этого нужно добавить cleafix DIV перед закрытием блока

<div class="container-fluid block-events" style="width: 1230px!important;"> 
    <div class="content"> 
     <div class="wrap"> 
     <div id="main" role="main" style="min-height:1200px!important;"> 
     <h1 class="clearfix"><?php echo $lang['koikuudised']; ?></h1> 
       <ul id="tiles"> 
       <?php while($gallery = mysqli_fetch_array($db)) { 
       ?> 
       <li> 
        <figure class="effect-marley"> 
         <a title="<?php echo $gallery['gallery_thumbnail']; ?>" data-lightbox="gallery-popup" href="<?php echo $CONF['installation_path'] . $gallery['gallery_thumbnail']; ?>"> 
          <img src="<?php echo $CONF['installation_path'] . 'system/timthumb.php?src=' . $CONF['installation_path'] . $gallery['gallery_thumbnail'] . '&h=350&zc=1'; ?>" alt="<?php echo $gallery['gallery_name']; ?>" /> 
         </a> 
         <figcaption> 
         <div class="brown"> 
          <p><?php echo $gallery['gallery_name']; ?></p> 
         </div>   
         </figcaption>   
        </figure> 
       </li> 
       <?php } ?> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <div class="clearfix"></div> 
</div> 

Или вы можете добавить ясно: как CSS рядный

<div class="container-fluid block-events" style="width: 1230px!important;"> 
    <div class="content"> 
     <div class="wrap"> 
     <div id="main" role="main" style="min-height:1200px!important;"> 
     <h1 class="clearfix"><?php echo $lang['koikuudised']; ?></h1> 
       <ul id="tiles"> 
       <?php while($gallery = mysqli_fetch_array($db)) { 
       ?> 
       <li> 
        <figure class="effect-marley"> 
         <a title="<?php echo $gallery['gallery_thumbnail']; ?>" data-lightbox="gallery-popup" href="<?php echo $CONF['installation_path'] . $gallery['gallery_thumbnail']; ?>"> 
          <img src="<?php echo $CONF['installation_path'] . 'system/timthumb.php?src=' . $CONF['installation_path'] . $gallery['gallery_thumbnail'] . '&h=350&zc=1'; ?>" alt="<?php echo $gallery['gallery_name']; ?>" /> 
         </a> 
         <figcaption> 
         <div class="brown"> 
          <p><?php echo $gallery['gallery_name']; ?></p> 
         </div>   
         </figcaption>   
        </figure> 
       </li> 
       <?php } ?> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <div style="clear:both;"></div> 
</div> 
+0

Он ничего не сделал. Я проверил свой css и **. Restaurant-full-width { padding-bottom: 5em; } ** –

Смежные вопросы