Question

我试图将两个缩略图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>

Answer 1

您可以使用display:inline-block;：

.thumbnail{
    display: inline-block;
}

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

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

1 个答案: