So I’m having the weirdest issue. I guess I’m misunderstanding something, because it’s doing it in all browsers. If I create a page-wrapper, and then do image replacement on the first <h1> element, and push it down with top-margin on the <h1>, it actually moves the border of the containing div also! Which it shouldn’t, because the h1 is inside the wrapper div! I have an image of the problem attached. You’ll see that there’s this weird bar behind the logo. it should be at the top of the page…
Here’s the relevant markup
Code:
Highly Reliable Systems
Telephone: 1(775)-329-5139
As well as the relevant CSS
Code:
h1 { display: block; width: 300px; height: 67px; background: url(../img/header_replace.png); text-indent: -9999px; margin: 95px 0 0 -135px }
div#main { background: url(../img/headerblock.png) top left no-repeat }
And…
Code:
.wrapper { width: 730px; margin: 0 auto }
body { background-color: #f8f8f8 }
Also, I’m using a modified meyer reset. It’s the one from Elliot Jay Stocks’ Starkers.