Hello,
body{
overflow-x: hidden;
width: 100%;
background: url(texture.png) fixed;
}
#wrapper {
position: relative;
background-color: #fff;
overflow-x: hidden;
width: 100%;
max-width: 40em;
margin: 25px auto;
}
In Opera, there’s a 25px white line where the texture.png img does not appear. How come?
Best
Good question. Without seeing the rest of the code, it’s difficult to know what the problem is (or at least, it is to me, there might be cleverer people around who can tell just from that) – if you can post a link to a page where you’re seeing that happen, we’ll have a better chance of figuring it out.
Change the ‘.png’ to uppercase to see if it worls. I’ve had a similar problem before.
Body in Opera wraps the element the moment you set an overflow state NOT stretching to full height automatically - setting margin on the inner element then exacerbates that collapse.
Try padding body instead of margin on the child element.
Though I have to ask, what’s with the overflow-x and width:100% on body? Just TRYING to remove the ability for people with screens smaller than your design’s ability to access it or something? I’d axe both of those settings on BODY… that max-width is a bit of a head scratcher too given that’s… 640px for 96dpi and
800px for 120dpi… really tiny stripe – is this from a mobile sheet?
NOT that I’d try to use fixed on a background image either – given what it does when you try to scroll the page in FF.
Could we see the page this is for? I’ve got the feeling you’re over-thinking your solutions – but again CSS without the HTML it’s applied to is most always gibberish… and snippets are like doing brain surgery over a time-phone to 1876.