Author Topic: Firefox and IE  (Read 6196 times)

0 Members and 1 Guest are viewing this topic.

Offline Mianame

  • Hero Member
  • *****
  • Female
  • Posts: 855
    • www.mirches.deviantart.com
Firefox and IE
« on: September 24, 2007, 08:07:44 pm »
First I was having trouble simply getting IE and Firefox to read my pictures. Now that I've finally managed to get that working, I now have two pages that look totally different in IE and Firefox.

Here's the webpage:

http://www.mianame.furtopia.org/Webpage%20Pieces/Main1.html

When I run it in IE it looks the way I want it to. Everything fits in the boxes and the boxes themselves fit their parameters. Yet in Firefox there's an overflow with text and all of the boxes look cut off. Any way I can fix that?

Offline Richard K Niner

  • Sr. Member
  • Indecision incarnate canine
  • ****
  • Male
  • Posts: 341
    • K9 Unit
Firefox and IE
« Reply #1 on: September 24, 2007, 08:53:25 pm »
Just out of curiosity, this works on IE 6, right? (There's a newer version out that would render your page completely differently.)

If this is so, I think I found the source of your problems:
Code Sample

div#left. div#right {
background-attachment: fixed;
overflow: auto;
}

These two rules, mean different things in the W3C standard and IE 6 (IE 7 and Firefox supposedly follows the W3C standard on this).

Simply put, "background-attachment:fixed;" means that when you scroll the page, the background stays put (but gets clipped so it doesn't bleed over to other elements -- you'll probably find that it's aligned to the top left corner of the page) in Firefox, but means "when the contents of this element are scrolled, don't move the background" in IE 6.  I'd say to remove that declaration, but the overflow rule complicates things.

Instead, try this: replace div#left and div#right with div#leftwrapper and div#rightwrapper, and remove those two rules from it.  Then, add the line "div#left, div#right {width:100%;height:100%;overflow:auto;}" to the end of your CSS file.  Finally, wrap the <div id="left">...</div> in <div id="leftwrapper">...</div>, and do the same for the other div (except call the outer one "rightwrapper").  This should fix the problem in Firefox, without breaking it in IE 6.





Offline Mianame

  • Hero Member
  • *****
  • Female
  • Posts: 855
    • www.mirches.deviantart.com
Firefox and IE
« Reply #2 on: September 24, 2007, 09:02:02 pm »
Nope, I'm running on 6.0 at the moment.

Offline Richard K Niner

  • Sr. Member
  • Indecision incarnate canine
  • ****
  • Male
  • Posts: 341
    • K9 Unit
Firefox and IE
« Reply #3 on: September 24, 2007, 09:14:27 pm »
Quote (Mianame @ Sep. 24 2007, 9:02 pm)
Nope, I'm running on 6.0 at the moment.

You mean "Yes, I'm running 6.0"...

Also, I figured I'd elaborate, and edited a solution into my above post.

(Based on the fact that it would probably break the same way in IE 7 as it does in Firefox.)

Offline Mianame

  • Hero Member
  • *****
  • Female
  • Posts: 855
    • www.mirches.deviantart.com
Firefox and IE
« Reply #4 on: September 24, 2007, 09:27:01 pm »
Sorry, I meant "yes I'm running IE 6.0" XD

Anyway, ti sounds like a solid solution, but it'll be a bit before I get the time to implement it. Still, it should definitely fix things. Thanks so much for your help!

Offline Richard K Niner

  • Sr. Member
  • Indecision incarnate canine
  • ****
  • Male
  • Posts: 341
    • K9 Unit
Firefox and IE
« Reply #5 on: September 24, 2007, 09:39:03 pm »
Heh, no problem.  And if you have any HTML/CSS/XML/other Internet acronym or buzzword problems in the future, don't hesitate to contact me for help (or ask again on the forum).

Offline Mianame

  • Hero Member
  • *****
  • Female
  • Posts: 855
    • www.mirches.deviantart.com
Firefox and IE
« Reply #6 on: September 25, 2007, 03:18:04 am »
Okay, thanks so much! I'll be sure to do that :3

Offline Mianame

  • Hero Member
  • *****
  • Female
  • Posts: 855
    • www.mirches.deviantart.com
Firefox and IE
« Reply #7 on: September 25, 2007, 08:50:18 pm »
Just wanted to update and say that it worked splendidly! Thank you soo much for your help! I was completely stumped.

Offline Kathera Lockharte144

  • Jr. Member
  • **
  • Female
  • Posts: 76
Firefox and IE
« Reply #8 on: October 26, 2007, 07:36:28 pm »
Quote (Mianame @ Sep. 24 2007, 8:07 pm)
First I was having trouble simply getting IE and Firefox to read my pictures. Now that I've finally managed to get that working, I now have two pages that look totally different in IE and Firefox.

Here's the webpage:

http://www.mianame.furtopia.org/Webpage%20Pieces/Main1.html

When I run it in IE it looks the way I want it to. Everything fits in the boxes and the boxes themselves fit their parameters. Yet in Firefox there's an overflow with text and all of the boxes look cut off. Any way I can fix that?

man I think I had that problem before, not the one with the pictures not showing, but rather an over flow, though my issue was with the frames I was using as the border, I was getting frustrated so I gave up on that site, this was before I became a furry, this was a metroid fan site I was working on that was giving me grief when I finally uploaded it on to a webhost, and even then the music didn't work, though I don't think it would have anyways with that host.