css only menu is behind and to the side in IE

Discussion in 'CSS' started by pearjam, Aug 24, 2009.

  1. #1
    Hello,

    I have a css only menu that works great everywhere! Except IE of course.

    It displays a little behind and to the right of where it's supposed to be which makes it hard to navigate.

    I've tried everything I can think of including z-index without luck.

    The URL is:
    http://fearelise.com

    You are welcome to view the site in both IE and FF to see the difference.

    You can view source to see the code.

    To see the css, go to http://fearelise.com/a-css.css

    Thank you all in advance!!
     
    pearjam, Aug 24, 2009 IP
  2. pearjam

    pearjam Guest

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    any ideas?
     
    pearjam, Aug 24, 2009 IP
  3. rob7676

    rob7676 Peon

    Messages:
    82
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #3
    It appears to look the same for me. I'm using IE 8. Which version of IE is giving you trouble? I can only test on 8, but you can use
    <!--[if IE]>
    	<link rel="stylesheet" type="text/css" href="ie-only.css" />
    <![endif]-->
    Code (markup):
    And copy your navigations styles into this new stylesheet and make the changes to make it work in IE
     
    rob7676, Aug 24, 2009 IP
  4. pearjam

    pearjam Guest

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I guess it's just IE6 and IE7... it looks normal in other browsers.

    I know there are a lot of little tricks to coding around ie, but there's something I'm missing. Surely other sites with dropdown css menus get around it - but I can't figure out how.
     
    pearjam, Aug 25, 2009 IP
  5. rob7676

    rob7676 Peon

    Messages:
    82
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #5
    I think I know what your talking about now except on my screen I am getting the navigation overlapping a little, but in front of the header image. If thats what your talking about try making the following changes.

    Add to #menu
    top:13px;
    Code (markup):
    Change #head
    height:140px;
    Code (markup):
    That fixed what I am seeing on my computer.
     
    rob7676, Aug 26, 2009 IP