Wednesday, 15 April 2015

html - twitter bootstrap - minimum width column? -



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