如何使用多个类堆叠Div / Container?

时间:2016-01-23 02:00:59

标签: html css containers

我试图将两个缩略图div放在一起。

CSS仅用于将我的YouTube视频保留在边境内。

我今天花了一些时间尝试搜索这个,但我没有找到任何对我有用的文章,作为HTML,CSS和Bootstrap代码的初学者。

.thumbnail iframe {
	padding-left: 3;
	padding-right: 3;
	padding-top: 3;
	padding-bottom: 3;
}
<div class="container">
  <div class="row">
    <div class="col-sm-6 col-md-4">
      <div class="thumbnail">
        <iframe class="col-lg-12 col-md-12 col-sm-12 col-xs-12" height="210" src="https://www.youtube.com/embed/ZwpLEUOprd8" frameborder="0" allowfullscreen></iframe>
        <div class="caption">
          <h3>100 SUBSCRIBERS!!!!</h3>
          <p>We reached 100 subscribers!</p>
          <p><a target="_blank" href="https://www.youtube.com/watch?v=ZwpLEUOprd8" class="btn btn-primary" role="button">View On YouTube</a></p>
        </div>
	  </div>
    </div>
  </div>
</div>

1 个答案:

答案 0 :(得分:0)

您可以使用display:inline-block;

.thumbnail{
    display: inline-block;
}

另一种方法是使用float,这可能会有些棘手,因为它有一些布局的缺点。