2015-10-07 15 views
0

У меня есть несколько видеороликов, которые я бы хотел изменить на родительский bootstrap div в формате сетки, но странно, что это увеличивает размер col, но не самого видео.Bootstrap 3: Установка видео в сетку

Вот пример того, как код идет в формате сетки. В моем файле CSS ширина и высота gif-видео класса установлены как 300.

Вот image, представляющий мою проблему.

Если я изменяю ширину и высоту gif-видео на 100%, вот как это выглядит. Размер правильный, но есть пустые места, как будто div был нажат.

Это image, представляющий эту проблему.

<div class="container"> 
    <div class="row"> 
    <div class="col-lg-3 col-md-4 col-xs-6 thumb"> 
       <video class="gif-video" autoplay loop poster="http://thumbs.gfycat.com/<%= title %>.jpg">  
        <source src=<%= gif.webmurl %> type="video/webm"> 
        <source src=<%= gif.mp4url %> type="video/mp4"> 
       </video> 
      </div> 
    </div> 
</div> 
+0

видео имеет raspect отношения прикрепляется к ним (16/9, 4/3 и т. Д.). Таким образом, ваш контейнер/сетка shoud имеет одинаковое соотношение сторон к ногам. –

+0

Прошу прощения, но я новичок в бутстрапе, но как установить, чтобы они имели одинаковое соотношение сторон? Когда я обновляю страницу до загрузки видео, у них есть правильный макет, но когда видео отображается, сетка прослушивается. – Wraithseeker

+1

Прочтите это, может быть, это поможет вам - http://getbootstrap.com/components/#responsive-embed –

ответ

0

Установить макс высоту и максимальная ширина в Div, некоторые видео должны было немного больше, и, возможно, нажмите вправо Прокладку или нижнюю

+0

Где я могу установить это под? Я просто установил их на 100%? Я заметил, что когда я обновляю страницу, макет именно то, что я хотел, но когда страница загружалась, она толкается вниз. – Wraithseeker

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