Search Engine Optimization > Web Development > CSS in different browsers
CSS in different browsers
Posted by Jarle Thorsen on July 18th, 2003

I am working on a new design for my website.

My problem is that my design, relying on CSS, works 100% in mozilla, but
has som quirks in Opera, and even more quirks in Internet Explorer.

Have a look at http://www.genbukan.no/nytt_design/

I would appreciate feedback on how to get this design to work in all
of the browsers, maybe there is missing something in my CSS ?
(http://www.genbukan.no/nytt_design/ninpo.css)


--
Jarle Thorsen

Posted by Richard Watson on July 18th, 2003

Jarle Thorsen <jarle@genbukan.no> writes:

It's not something you're missing - it's IE that's missing position:
fixed, you probably want to give it a position:absolute to chew on
instead.

--
Richard Watson
http://www.opencolo.com/
High Value Colocation

Posted by Jarle Thorsen on July 18th, 2003

"Richard Watson" <tinnedmeat@doilywood.org.uk> writes:
Thanks a lot for your swift reply. Setting position:absolute, fixed all the
problems I was experiencing in both Opera and IE. Even though I would like
to have the left and right frames to stay fixed alle the time in all
browsers.....


--
Jarle Thorsen
Q: What does a peroxide blonde and a 747 have in common?
A1: They both have a black box.
A2: Both have a cockpit.

Posted by Richard Watson on July 18th, 2003

Jarle Thorsen <jarle@genbukan.no> writes:

What you can do is something like the following:


div.cornerpiece {
position: absolute;
top:0px;
left:0px;

}

body>div.cornerpiece
{
position: fixed;
}


IE doesn't understand body>div.cornerpiece which is perfectly
understood by mozilla and friends, so you get the best of both
worlds.

--
Richard Watson
http://www.opencolo.com/
High Value Colocation

Posted by Jarle Thorsen on July 18th, 2003

"Richard Watson" <tinnedmeat@doilywood.org.uk> writes:
would that mean that I could just add:

body>#left, body>#right{
position:fixed;
}

To the CSS file I already have, or is this wrong syntax ?

--
Jarle Thorsen


Posted by Jarle Thorsen on July 18th, 2003

"Richard Watson" <tinnedmeat@doilywood.org.uk> writes:
This works just as it is supposed to when it comes to Mozilla vs. Internet
Explorer.

Only problem is Opera. Opera understands the body> schema, but it has some
strange way of interpreting the position:fixed;

If you have Opera running have a look at
http://www.genbukan.no/nytt_design/

Seems like the upper/lower corner on left and right side is position:fixed
if you only scroll x pixles, but if you scroll more than that they start
moving!


--
Jarle Thorsen
"I'd love to go out with you, but I've been scheduled for a karma transplant."

Posted by Richard Watson on July 18th, 2003

Jarle Thorsen <jarle@genbukan.no> writes:

Sounds distinctly like a bug. I'm using opera 6.12 here on Linux/X11
with no problems like that.

--
Richard Watson
http://www.opencolo.com/
High Value Colocation

Posted by Redcat on July 20th, 2003


"Jarle Thorsen" <jarle@genbukan.no> wrote in message
news:m2k7agc97k.fsf@maskin.flamestrike.no-ip.org...
Not related to the question, but just as a matter of interest, why are you
using PNG files? I would have though that jpgs would have been much better.

Andy



Posted by Jarle Thorsen on July 21st, 2003

"Redcat" <nospam@redcatmedia.net> writes:
No special reason actually. I was just of the impression that png was the
image format usually recommended for web-presentations....

--
Jarle Thorsen


Posted by Chris Morris on July 21st, 2003

Jarle Thorsen <jarle@genbukan.no> writes:
PNG is good for images with large areas of flat colour, which it
compresses very well, and images that have to be *exact* regardless of
eventual file size.

JPG is good for getting high levels of (slightly lossy) compression on
photographs and similarly complex images.

GIF is good for being an alternative to PNG for older browsers (if you
have content negotiation) and also can give smaller file size than PNG
for small images of <= 16 colours.

--
Chris

Funbolt.com - Entertainment portal, wallpapers, sexy celebs