html - trying to align three images in twitter bootstrap 2.3.2 row/span -
i trying align 3 images centered in row, evenly.
here fiddle of markup, http://jsfiddle.net/bkmorse/btcrk
<div class="container" <div class="row" style="border:1px solid red;"> <div class="span12"> <a href="" class="share-icon facebook" title="share on facebook">share on facebook</a> <a href="" class="share-icon twitter" title="share on twitter">share on twitter</a> <a href="" class="share-icon email" title="share in email">send email</a> </div> </div> </div>
a.share-icon { height:64px; display: inline-block; width:64px; text-decoration: none; text-indent: -10000px; font-size: 0px; line-height: 0px; } a.share-icon.facebook { background: #fff url('http://f.cl.ly/items/3f1o172z1o0824021f2c/facebook.jpg') no-repeat; } a.share-icon.twitter { background: #fff url('http://f.cl.ly/items/3c3i1b0g0o0v3v1z3i2i/twitter.jpg') no-repeat; } a.share-icon.email { background: #fff url('http://f.cl.ly/items/3e1e0o3a0s0i3g3r2x2t/email.jpg') no-repeat; }
i've tried text-align:center; i've tried pull-left/right. not having luck. appreciated.
thanks!
or, can use text-center
class..
<div class="container"> <div class="row" style="border:1px solid red;"> <div class="span12 text-center"> <a href="" class="share-icon facebook" title="share on facebook">share on facebook</a> <a href="" class="share-icon twitter" title="share on twitter">share on twitter</a> <a href="" class="share-icon email" title="share in email">send email</a> </div> </div> </div>
demo: http://bootply.com/70873
Comments
Post a Comment