Inhalt unter Sidebar in Bootstrap

Question

Ich bin relativ Anfänger, wenn es um Bootstrap geht. Ich möchte Inhalte unter dem richtigen Inhaltsblock in voller Breite strecken. Ich habe einen Screencast beigefügt, der zeigen soll, was ich versuche zu tun. Ich habe versucht, Offset auf dem rechten Block zu verwenden, aber es tut nicht, was ich will. Gibt es eine Möglichkeit, wie Bootstrap das handhabt oder muss das etwas benutzerdefiniertes sein?

http://screencast.com/t/ZxJGOBEy

Hier ist mein Code (was nicht viel ist):

<div class="container"> 
     <div class="row"> 
      <div class="col-md-12"> 
       <div class="col-md-8"> 

       <p>"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?"</p> 

       <p>"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?"</p> 

       <p>"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?"</p> 
      </div> 

      <div class="col-md-4"> 
       <img src="http://dummyimage.com/200" /> 
       <img src="http://dummyimage.com/200" /> 
      </div> 
     </div> 
    </div> 

Answer 1

Also, was haben Sie jetzt zwei Side-by-Side-Spalten. Der Text aus .col-md-8 kann sich nie in die andere Spalte überschneiden, da sie jeweils eigene Boxen, eigene Domains, besitzen. Um den Effekt zu erhalten, den Sie suchen, müssen Sie das div-Wrapping um Ihre Bilder in das div-Wrapping um den Text einführen und .pull-right hinzufügen (das ist eines von Bootstrap's helper classes und zwingt das div, nach rechts zu floaten), z. :

<div class="col-md-4 pull-right"> 
     <img src="http://dummyimage.com/200" /> 
     <img src="http://dummyimage.com/200" /> 
    </div> 

können Sie das Ergebnis hier sehen: http://codepen.io/angeliquejw/pen/zqwpgg?editors=1000