I’ve got an interesting box-model problem here. I have a header full of links, and for some reason my 0px margins are ignored and appear as 2px margins surrounding each link.
I’ve set up a test page at http://www.gimmesomeoven.com/test.htm to illustrate the problem. Each link in the header should be a 56px square link with a 1px border and 2px between each link (instead of 4 as it displays). In this case, I’ve had to set up negative margins on each link, but that is certainly not ideal case.
For some reason, things will not render correctly. Plus, this solution only works in modern browsers: IE8, Chrome, FF3+ (thanks browsershots.org..)
Any help on this would be greatly appreciated. It’s been proving much more difficult than I anticipated.
I think the problem is that you have spaces between each
<a>. Try floating them left to squash the spaces, unless you want to put all that code on one line in your HTML. You should be able to get rid of the negative margins then too… you shouldn’t need them here.