I'm a bit lost where the problem might be, so I can't be that specific but I guess the other problem has something to do with z-index. I made homepages for my friend and they seem to work fine in Firefox and Safari, but there are two problems with Internet Explorer (and possibly with some later version of Firefox) and I can't get my head around them.
The splatter image on the left hand corner isn't visible on IE and the menu items 2 and 3 are working incorrectly. I'd really appreciate it if you could point me to right direction. Page address is http://www.tanjatorvikoski.fi/ and it's not written in English, but I guess it won't matter.
Hi, Wow, you've got a tricky
Hi, Wow, you've got a tricky one there. The page isn't at all structured the way I would do it, so it's difficult to make a suggestion.
My first thought was that you have a PNG file for the "splatter", and that maybe someone was using IE6. But IE7 doesn't show it, either.
I think you're on the right track with asking about z-index, and here's my best guess...
"roiske" is wider than it needs to be, and is overlapping "head" and "vali". Because both "head" and "vali" have the (pretty enormous) z-index of 3000, they win the fight against the overly wide "roiske", and cancel it out.
I suggest having "roiske" only be 150px wide or so, much narrower. Then it should not overlap "head" at all. See if that works with IE.
Good luck, Dave
I tried narrowing the
I tried narrowing the splatter image to 149px and now it shouldn't be overlapping any other elements but it still doesn't seem to work. It's weird that at some point (not anymore I guess) the splatter image appeared depending where your cursor was on the page at the time of reloading... There seems to be quite large "etusivu" element that comes from which is necessary for the menu to work properly, that is showing the page you're at with different colour on the menu. It seems IE is really making my life miserable. This feels really hard to fix since I have no clue where to start.
Any other suggestions?
Wow. Yes, IE is dreadful,
Wow. Yes, IE is dreadful, and it's tyranny to have to code for it - the worst part of a CSS person's job, IMO.
Last quick idea: I wonder if making "roiske" positioned "absolute" would make it visible. Of course, I guess that it will begin to scroll.
If that doesn't work, here's a fix that may work (back up everything first)... you'll need to do image editing. You could take kukat.png, make it wider, about 1000 px. Then put the splatter image into it on the left side. Finally, you would need to make DIV #kukat wider (again, about 1000px) so it extends all the way to the left.
Then you could remove "roiske", because there's no need for it anymore - your splatter image should be on the left side of kukat.png.
Beyond those ideas, unfortunately I would entirely restructure the page, using maybe 3-column classic column design with floats.
Good luck! Dave