twitter bootstrap - Resizing Problems of Thumbnail Caption -


i have problem resizing of thumbnail captions in line 3 want "2012" aligned left , "1.preis" aligned right. first thing don't understand seems have 10 columns work with. when try use col-md-offset-10 "1.preis" jumps next line.

here bootply code example. http://bootply.com/82887 can see when try resize window (before goes tablet size mode) "1.preis" leave thumbnail border.

<div class="row">            <div class="col-md-3">             <div class="thumbnail">                 <img src="http://lorempixel.com/400/300/">                 <div class="caption">                     <p>wohnprojekt eggenberger gürtel</p>                     <p>graz-gries</p>                     <div class="row">                         <div class="col-md-1"><p>2012</p></div>                         <div class="col-md-1 col-md-offset-8"><p>1.preis</p></div>                     </div>                 </div>             </div>         </div>         <div class="col-md-3">             <div class="thumbnail">                 <img src="http://lorempixel.com/400/300/">                 <div class="caption">                     <p>gutachterverfahren kalsdorf-siro</p>                     <p>kalsdorf</p>                     <p>2011</p>                 </div>             </div>         </div>         <div class="col-md-3">             <div class="thumbnail">                 <img src="http://lorempixel.com/400/300/">                 <div class="caption">                     <p>gutachterverfahren kalsdorf-siro</p>                     <p>kalsdorf</p>                     <p>2011</p>                 </div>             </div>         </div>         <div class="col-md-3">             <div class="thumbnail">                 <img src="http://lorempixel.com/400/300/">                 <div class="caption">                     <p>gutachterverfahren kalsdorf-siro</p>                     <p>kalsdorf</p>                     <p>2011</p>                 </div>             </div>         </div>     </div> 

you use floats appearance want:

<div class="thumbnail">     <img src="http://lorempixel.com/400/300/">     <div class="caption">         <p>wohnprojekt eggenberger gürtel</p>         <p>graz-gries</p>         <p style="float:left;">2012</p>         <p style="text-align:right;">1.preis</p>     </div> </div> 

demo


Comments

Popular posts from this blog

c# - How Configure Devart dotConnect for SQLite Code First? -

java - Copying object fields -

c++ - Clear the memory after returning a vector in a function -