Screwy Dix Boxes, new problem - see edited post Options

[Edonil]

Ok, so I didn't want to start a new topic, 'cause I start to many of those here. You must all think I'm html illiterate by now.

Anyone going through old posts, the header wasn't showing up because I was an idiot and forgot the # in the css.



Anyway, onto the problem. On my new layout (testpage.edonil.com), the div boxes aren't all working. (They should be divided up like at testpage.edonil.com/basic.gif) If I set the background-attachment: fixed in my css (layout.css), my page works great in IE, but something gets screwed up in Firefox and Netscape (see the box which is dark blue in basic.gif - the gold border is over on the left side of the image, rather than the right). However, if I get rid of background-attachment: fixed, the background image scrolls in IE (see test.edonil.com/dolls/ - it's the main div box, where the Terms of Use are).

Any idea on how I could fix this? Or would it be better to just get rid of the fixed background, and the people with IE would have to suffer?

[Hwesta]

I have no clue, but it fails validation and there's a few block vs inline errors that I saw. -prod-

Oh! You don't have a # in front of the color specifications. Maybe that's it?

[Emagine]

Yah it looks like this is why...

color: FFDD77;

it needs to be..

color: #FFDD77;

Try that Hex values should always have # on the front.
Cos the font and all is working so its getting the CSS just not the colour.

[Edonil]

Hey, it worked! Yay! Thankees!

I guess I'll never know why it was only failing on some pages, and why H3 was working in the index... *sighs*

[Edonil]

Rather than start a new topic, I edited the top post. Help?

[Whitestar]

That's odd.
I thought at first it may be the IE box model problem, but you've got your padding set to 0 so it's probably not.
Perhaps if you try using the background-position tag instead of background-attachment - there's more about it here.

If that doesn't work, I'd recommend not using seperate background images for each of your divs, but just having one image that comprises the background of a container div, then using the absolute postioning to place the text over that.

[Edonil]

^ That didn't work. *sighs*

But I found another solution. I created another div without a background on top of the div with the background. More divs than I would like, but it worked.