SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Zealot
    Join Date
    Feb 2005
    Posts
    195
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    css works in IE but not mozilla/firefox

    I put up a top sites script at http://top.arcade.nu/ .

    It looks very different in IE and mozilla and I am pretty sure the way it looks in IE is the way they meant. Since it is others CSS and I am not yet fluent in CSS I really don't know why or the issues yet.

    Can anyone take a look at the it and see if they have some ideas/hints how to make it look better on gecko based browsers?
    Set up a free Instant Arcade!!
    Find the domainname you want at ExpireWorks.com
    Free $6.95 directi account

  2. #2
    Twitter - @CarlBeckel busy's Avatar
    Join Date
    May 2004
    Location
    Richmond, VA, USA
    Posts
    819
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Can anyone take a look at the it and see
    I'd love to, but it's not loading. Here's how I handle cross browser issues though. I hope you are using external stylesheets.

    When declaring your stylesheets, use seperate ones, like this...
    Code:
    <link rel="stylesheet" href="main.css" type="text/css" />
    <!--[if lte IE 7]><link rel="stylesheet" href="ie7.css" type="text/css" /><![endif]-->
    <!--[if lte IE 6]><link rel="stylesheet" href="ie6.css" type="text/css" /><![endif]-->
    <!--[if lte IE 5]><link rel="stylesheet" href="ie5.css" type="text/css" /><![endif]-->
    main.css is for all browsers.
    For the rest of them, you can override or set rules for each version of internet explorer.
    ie7.css is for internet explorer 7 and below (When it comes out this year)
    ie6.css is for version 6 and below, ie5.css is for 5 and below etc...

    Oh, your site loaded and I can see the difference now. Hmmmm.... you've really got a lot going on there. Lots and lots of tables

    To be honest, I think it might take less time to learn tableless design and redo the site than it would to try to make it work cross browser with the code you're using. It'll make your job WAY easier too. Sorry I couldn't be more help.

    BTW, this article helped me understand CSS design concepts when I first started, maybe it'll help you.
    http://www.sitepoint.com/article/tables-vs-css

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,366
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    You have defined 5 class called 0,1,2,3 and 4. Firefox doesnt recognise classes that start with a number so you should use text as follows.
    Code:
    .nought {
     background-color: #FF9900;
    }
    .one {
     background-color: #FFCC66;
    }
    .two {
     background-color: #FFCC88;
    }
    .three {
     background-color: #AA5555;
    }
    .four {
     background-color: #AA7777;
    }
    Change the classes in the html to match also. (search and replace in your editor)

    e.g.

    Code:
     <table class="nought" cellpadding="2" cellspacing="1" border="0">
    Your page has some errors so you might considering tidying the page up and using a doctype

  4. #4
    SitePoint Zealot
    Join Date
    Feb 2005
    Posts
    195
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    @busy, thanks, I know, it is not my design/script and not how I would have done things if I was starting from scratch.

    Quote Originally Posted by Paul O'B
    Hi,

    You have defined 5 class called 0,1,2,3 and 4. Firefox doesnt recognise classes that start with a number
    Thanks, that was the clue I needed.

    Your page has some errors so you might considering tidying the page up and using a doctype
    yeah, I wanted to have a path to make it usable with mozilla before I invested much more time into it. I was scratching my head at that for too long!

    I added the doctype and got rid of about 80% of the errors so far now.
    Set up a free Instant Arcade!!
    Find the domainname you want at ExpireWorks.com
    Free $6.95 directi account

  5. #5
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Firefox doesnt recognise classes that start with a number
    And, actually, the standard says classes are not to start with a number and FF follows the rules.
    make it usable with mozilla before I invested much more time into it.
    Just to be sure I understand, I advise you to make it useable in mozilla/FF before anything else because IE is not very good at these things.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •