html - twitter bootstrap - minimum width column? -
this has have been asked before, don't think "terms" correct.
i have page has text, , image. when image ends, text flow under image.
so,
<div class="row"> <div class="col-xs-10 col-xs-offset-1 "> <div class="hero-unit row"> <div class="col-xs-12 "> <h2 class="welcome">welcome</h2> </div> <div class="col-xs-8 "> <p>some text here</p> <p>imagine there more text here</p> <p>just, text ever.</p> </div>//col-xs-8 <div class="solidclass col-xs-4 "> <img class="img-responsive" src="/webcontent/img/both.png" alt="screenshots"/> </div> </div>//hero-unit-row </div> //col-xs-10 </div>//row
in scenario above, text in "col-xs-8" row should overflow when text gets past image in col-xs-4 row.
is there can tell bootstrap way of class, or can add together specialty class create happen?
the construction need layout next:
<div class="col-xs-12"> <div class="solidclass col-xs-4 pull-right"> <img class="img-responsive" src="http://lorempixel.com/100/100" alt="screenshots" /> </div> <p>some text here</p> <p>imagine there more text here</p> <p>just, text ever.</p> </div>
demo: http://plnkr.co/edit/vsq4rsjpbjfvdn6fyir9?p=preview two of import points:
extend "left" text container total width .col-xs-12
class.
move image container text container , float right pull-right
class.
html css twitter-bootstrap
No comments:
Post a Comment