Vorlage und p-Tag in der gleichen Zeile

Question

https://jsfiddle.net/dhaileytaha/ghuj4jL8/7/ wie in der obigen Geige ich den p-Tag auf der linken Seite benötigen und die Schablone auf der rechten Seite auf dem gleichen Niveau

<p>abcdefg</p> 
<!-- Offers List - START --> 
    <div class="container"> 
    <div class="row"> 
    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4"> 
     <div class="listing listing-default"> 
      <div class="shape"> 
       <div class="shape-text">buy</div> 
      </div> 
      <div class="listing-content"> 
       <h3 class="lead">Standard listing</h3> 
       <p>Buy items on normal prices. No discounts available for this listing.</p> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
<p>uvwzyx</p> 

Answer 1

Der Grund ist immer

<div class="row"> 
    <div class="col-...">column1</div> 
    <div class="col-...">column2</div> 
    ... 
</div> 

12 Spalten repräsentieren die gesamte Breite.

Bootstrap grid

Das Beispiel hat drei Spalten:

<div class="row"> 
    <div class="col-xs-2 col-sm-2 col-md2"> 
     <p>abcdefg</p> 
    </div> 
    <div class="col-xs-8 col-sm-8 col-md-4 col-lg-4"> 
     <div class="listing listing-default"> 
      <div class="shape"> 
       <div class="shape-text">buy</div> 
      </div> 
      <div class="listing-content"> 
       <h3 class="lead">Standard listing</h3> 
       <p>Buy items on normal prices. No discounts available for this listing.</p> 
      </div> 
     </div> 
    </div> 
    <div class="col-xs-2 col-sm-2 col-md2"> 
     <p>uvwzyx</p> 
    </div> 
</div> 

JSFiddle