I have an html5 page with a navbar. Completely scratch coded. I just recently added a doctype to the item, and now I’m getting extra space under my navbar. If I remove the docty
I've never used display: inline-block
due to the IE7 issues, so I'm not familiar with its quirks. It seems like it's unnecessary to apply it to ul#pagetab
in your situation, since it's not surrounded by inline elements. I would just convert it to a regular block element. Moreover, since it contains floated elements that do not need float beside some inline elements, I would just give ul#pagetab
a real height via display: block; overflow: hidden;
.
This appears to resolve all your issues (which I can't account for in detail) and provides stylistically more appropriate styles.