vertical align text via CSS?

[tradmusic.com]

Sorry to re-post, but my original post didn't seem to appear. Here it is
again:

I am experimenting with a roll-over but am struggling to get the text to
align, vertically, in the middle:

#sidebar a:link, #sidebar a:visited {
border: 1px solid #7A95CA;
display: block;
height: 30px;
text-decoration: none;
color: #7A95CA;
padding: 0px 6px 0px 14px;
}

#sidebar a:hover, #sidebar a:active {
border: 1px solid #7A95CA;
height: 30px;
text-decoration: underline;
color: #FFFFFF;
padding: 0px 6px 0px 14px;
background-color: #7A95CA;
}

I have set the height to 30px, but the text appears to be aligning to the
"top" by default.
I've tried adding:
vertical-align: middle;
....but this isn't working.

Any ideas?

Also, is there anywhere on the web I could access a chart of CSS commands?
Thanks.
Nath.

[Els]

tradmusic.com wrote:

I am experimenting with a roll-over but am struggling to get the text to
align, vertically, in the middle:

#sidebar a:link, #sidebar a:visited {
border: 1px solid #7A95CA;
display: block;
height: 30px;
text-decoration: none;
color: #7A95CA;
padding: 0px 6px 0px 14px;
}

#sidebar a:hover, #sidebar a:active {
border: 1px solid #7A95CA;
height: 30px;
text-decoration: underline;
color: #FFFFFF;
padding: 0px 6px 0px 14px;
background-color: #7A95CA;
}

I have set the height to 30px, but the text appears to be aligning to the
"top" by default.
I've tried adding:
vertical-align: middle;
...but this isn't working.
Correct ;-)
Any ideas?

Set line-height equal to height.
Not a good idea if there is a chance of wrapping lines though.
Also, if you set the height/line-height in pixels, stuff might become
unreadable when resizing the font in the browser. Better use .em for
the height and line-height to let it grow/shrink with user font-size
setting.

--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/

[Chris Beall]

tradmusic.com wrote:

(snip)

Also, is there anywhere on the web I could access a chart of CSS commands?
Thanks.
Nath.

Nath,

Correct terminology is important.

CSS has 'selectors', which determine which objects a set of style
'properties' will apply to.

Everything you wanted to know about selectors is at
http://www.w3.org/TR/CSS21/selector.html.

The chart of CSS properties is at http://www.w3.org/TR/CSS21/propidx.html.

Chris Beall