CSS working on Chrome but not on FireFox and IE

Discussion in 'CSS' started by ntomer, Oct 19, 2010.

0
  1. #1
    Hi,

    I've created a HTML tab panel using CSS. It is working fine in chrome but is jumbled up a bit in FireFox (if tabs are more than 3, they are misaligned.
    Whereas in IE, it's totally screwed up (in addition to the above problem, even the absolute positioning of logo mage doesn't work.

    Please check the app here - http://nttodo.appspot.com; username is nttodo@zoho.com and password is test_1234.

    Please help.

    Regards

    Nitin
     
    ntomer, Oct 19, 2010 IP
  2. ethikz

    ethikz Peon

    Messages:
    92
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I use firefox and it looks like it works fine to me
     
    ethikz, Oct 20, 2010 IP
  3. ntomer

    ntomer Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Hi,

    I managed to make it work by making the following changes -

    For IE8, added the following doc type -

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


    For IE 6&7, added a comma between logo and header -

    /* hasLayout */
    .header,
    .logo {
    zoom:1;
    }

    And for IE 6, made the following change in tabs1.css -

    #theader ul#primary
    {
    left:0 // added
    }

    Thanks

    Nitin
     
    ntomer, Oct 20, 2010 IP
  4. ethikz

    ethikz Peon

    Messages:
    92
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #4
    for future reference you always want to have the doctype in your html at the very beginning. so make sure every time you design a page to have transitional or strict
     
    ethikz, Oct 20, 2010 IP