On 4/5/12, AJ Putnam <photom...@ajputnam.com> wrote: > I have a couple of small images that I am trying to make sure are > vertically centered in a nav bar and I just can't > get my head around how to do it. > > Sample page: > > http://riverviewchamberplayers.com/about/index-12.htm > > And CSS at > > http://riverviewchamberplayers.com/style2010.css > > > In the first link, the rainbow flag and FB icon need to be vertically > centered. Have tried adding an attribute just to each image, > and a subclass but am striking out. Have tried valign=middle as well as > padding-top and margin-top but the latter two only > create too much space beneath the nav bar, throwing the background graphics > out of alignment. > > If you look at other pages, you can see the FB icon is hovering just below > centered. > > What (probably stupidly obvious) thing am I missing? > > Thanks in advance... > > Amy
Rather than adding top margin to the images, try a negative value on a bottom margin. I tried the following on the FB icon within Firefox's "edit HTML" feature of the web developer extension: style="margin-bottom:-5px;" It centered the image, vertically, pretty well. As each icon is different, you might have to do each separately, rather than create one class for both. ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
