vertical-align: middle with Bootstrap 2

Viewed 105318

I use the twitter bootstrap and I wanted to align verticaly a div block with a picture and the text at the right.

Here is the code:

<ol class="row" id="possibilities">
     <li class="span6">
         <div class="row">
             <div class="span3">
                 <p>some text here</p>
                 <p>Text Here too</p>
             </div>
             <figure class="span3"><img src="img/screenshots/options.png" alt="Some text" /></figure>
         </div>
     </li>
     <li class="span6">
         <div class="row">
             <figure class="span3"><img src="img/qrcode.png" alt="Some text" /></figure>
             <div class="span3">
                 <p>Some text</p>
                 <p>Some text here too.</p>
             </div>
         </div>
     </li>
</ol>

I tried this but not wortks:

.span6 .row{display: table;}
.span6 .row .span3, .span6 .row figure{display:table-cell; vertical-align: middle;}

I tried this too:

.span6 .row .span3{display: inline-block; vertical-align: middle;}

None is working. Does somebody have an idea? Thanks in advance.

5 Answers
Related