Bootstrap - 在.fluid容器内部装有盒装网格

Question

请查看这两张照片

我不知道如何在盒装bootstrap div中获得“.myDivInTheGrid”。有什么建议吗？

我有这样的事情......

<div class="fluid-container">
        <div class="col-md-6"></div><!-- Div with image -->
        <div class="col-md-6">
          <div class="myDivInTheGrid"></div>
        </div><!-- div with content -->
    </div>

Answer 1

我创建了一个工作示例，其中包含您在图片中显示的div中的图片。我为col-md-*制作了它，但你可以为更大的网格系统做同样的事情。如果您的屏幕较小，请拉伸浏览器。查看HERE

代码是这样的： HTML ：

  body
  <div class="container-fluid">
     .fluid-container
     <div class="row">
        <div class="col-md-6">
           .col-md-6
        </div>

        <div class="col-md-6">
            <div class="row">
                .col-md-6
            </div>
            <img class="row" src="http://s22.postimg.org/8z6hs0mch/Chrysanthemum.jpg"/>
        </div>
    </div>
  </div>

CSS：

 body{
    background:#8EC34D;
    color: white;
 }

 .container-fluid {
    background: #81AD4B;
    position: relative;
    top: 40px;
    padding-bottom: 40px;
 }

 .col-md-6 {
     background:#769C47;
     height: 300px;
  }

 img {
    width: 256px;
    height: 192px;
 }