Twitter bootstrap 引导网格对齐问题

我需要这个布局，看图片，我试了很多，但都不管用。。这是我的密码：

<div class="row content-container">

            <div class="col-md-9" id="map-content">
            <h1>#Map</h1>

        </div> <!-- MAP -->

        <div class="col-md-3" id="route">
        <h1>#Route</h1>
        </div> <!-- Route -->

        <div class="col-md-9" id="breadcrumbs">
        </div> <!-- Breadcrumbs -->


    </div> <!--Row Content--> 

退房

---

你问什么完全不清楚。您的图像无法识别与您的代码相关的任何内容，如列的位置以及这些列是否要在移动设备上按特定顺序堆叠等。您需要提供更多信息/上下文。请参见>和>

<div class="container">

  <div class="row ">

    <div class="col-xs-6">
      <div class="col-xs-12" style="background: green; height: 60px;">Aaa</div>
      <div class="col-xs-12" style="background: red; height: 60px;">Bbb</div>
    </div>
      <div class="col-xs-6" style="background: blue; height: 120px;">Bbb</div>

  </div>  

</div>