css內聯塊和自舉網格系統輸出

Question

我正在嘗試使用css和bootstrap 3.2對我的div進行特定的HTML標記。下面的圖片展示了我想要得到的結果。

我已經使用了引導網格系統，以便我的頁面能夠響應並正確顯示在小屏幕設備中。這是我試過的代碼。我用http://www.bootply.com來測試它。

任何想法如何獲得標記？

<div> 
    <div style="display:inline-block; border:1px solid gray; width:150px; height:150px;"> 
    <img src='' alt="image go here !"/> 
    </div> 

    <div class="container-fluid" style="display:inline-block;"> 
    <div class="row" style="border:1px solid gray;"> 
     <div class="col-md-9">This is the product name</div> 
     <div class="col-md-3 text-right">1 230.99</div> 
    </div> 

    <div class="row" style="display:inline-block; border:1px solid gray;"> 
     <div class="col-md-6">Property 1</div> 
     <div class="col-md-6">Property 2</div> 
    </div> 
    </div> 
</div> 

期望的結果：

編輯：結果我得到：

Answer 1

I've created a Bootply for you.

<div class="container"> 
    <div class="row"> 

     <div class="col-md-3"> 
      <div class="img"> 
       <img src=""> 
      </div> 
     </div> 

     <div class="col-md-9"> 
      <div class="row"> 
      <div class="col-md-8"> 
       This is the product name 
      </div> 
      <div class="col-md-4"> 
       1 230.99 
      </div> 
      </div> 

      <div class="row"> 
      <div class="col-md-6"> 
       Property 1 
      </div> 
      <div class="col-md-6"> 
       Property 2 
      </div> 
      </div> 
     </div> 

    </div> 
</div>