Can't understand why this is happening

MrBaseball34 2011-03-02 21:00:50 UTC #1

I'm trying to sprite some navigation buttons and having troubles.
I can't figure out why I can't get the new one lined up like the original.

original:
http://www.listinventory.com/

New:
http://www.listinventory.com/index2.php

Can anyone help out here?

AtSea_webdesign 2011-03-02 21:14:59 UTC #2

I see #navigation css is different on both pages. One has a margin-top: 20px while the other does not.

Did you match your CSS for both pages?

MrBaseball34 2011-03-03 14:19:28 UTC #3

In the original, the CSS for #navigation has float:left. If I do that in the new CSS, all the buttons stack up next to the logo on top of each other. Adding the margin-top value to the new CSS just moves the buttons AND logo down.

It is strange. Looking at the div in Firebug something is very strange.
When hovering over the div in the left pane, it usually highlights the div in light blue in the top pane (the browser window). But it highlights it in yellow and, even if I set the width to 725px, it shows it the full width of the container.

MrBaseball34 2011-03-03 14:20:45 UTC #4

You don't think the text-indent has anything to do with that, do you? That is there to hide the anchor text. It is needed for SEO.

MrBaseball34 2011-03-03 14:40:20 UTC #5

Oh, I finally got it. Just had to add padding-top value as 20 .vs margin-top. Geez, this is frustrating.

ShopVersioningReferenceArticlesPremium