Re: inline-block vs. float

[wolfcry911]

I have seen a comment formatted like that before. That is just like an HTML if statement?
It’s a conditional comment – the defacto standard for feeding IE fixes for several years now.

I did notice that IE 8 put the dashed line at the end of the menu as well (after SignOut). Does that have something to do with IE8 not supporting last-child I take it?
Yes, that’s correct. I probably should have put the border on the left and used first-child to remove it from the first. IE 7 and 8 understand first-child, but not last (IIRC). You could feed IE 6 ( 7 and 8 ) a fix with conditional comments. Or you could class the first or last anchor and target it that way.

The only thing thing really that is an image is the logo.Which is content, so that is good. But, I don’t want you to think that background images in css are bad – they’re not. Sometimes, however, it’s just quicker, easier, lighter to use straight css.

If you don’t mind, I will use more of what you did in your example instead of using all those sprites and such
I don’t mind at all. I was just hoping to help you out.

Is the 16px/30px is defining the size of the lower case caps and the upper case caps?
No, the 16px is font-size and the 30px is line-height – which centers the font vertically within the nav – more or less. It will be 1px off from browser to browser because of the way fonts and inline boxes work. You could also not set the line-height and use top padding to center vertically. The upper and lower case caps was achieved with the font-variant: small-caps (which is in the font shorthand rule).

and how did you know it was the capitals font?
;)
Capitals should be available to anyone with MS Office installed (PC or Mac) which is a very large percentage of probable viewers. I set a fallback to Georgia if Capitals is not available and then to serif if Georgia is not available – you can change or add as many fallbacks as you like. So most of the visitors will see it the way you intended and small percentage will see something very close (and will have no idea its not your first choice). You could also use @font-face, like Christopher mentions above, to pretty much guarantee that everyone sees the same font.