IE width problem using css <ul> menu

Discussion in 'CSS' started by shofstetter, May 12, 2011.

  1. #1
    I have a vertical menu on my website created using css and an unordered list.

    It looks and works great in firefox, chrome, and safari. But in internet explorer the menu is almost twice as wide, taking up half of the page, I can't figure out how to get it to display the same width as it does in the other browsers. It seems like internet explorer just ignores the width settings. If you click the compatibility view button in internet explorer it shows correctly, but when I tried using the meta tag X-UA-Compatible to force compatibility view, it didn't have the same result as clicking the button?

    So how can I make internet exploder display the menu with the correct width?

    The page is http://magnafabrics.com
     
    shofstetter, May 12, 2011 IP
  2. Chmarus

    Chmarus Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Why did u placed divs in table? On that kind of layout you can easily use just divs. Much easier to set up (even in IE :p )
     
    Chmarus, May 12, 2011 IP
  3. egreenr2

    egreenr2 Peon

    Messages:
    19
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    best solution for your problem is ...just create a div tag with width = 200 px or any thing according to your choice . Then insert your vertical menu with in that. Assign the width of the vertical menu = 100 % . Then check out the result and report here. Hope this helps u
     
    egreenr2, May 12, 2011 IP
  4. egreenr2

    egreenr2 Peon

    Messages:
    19
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    okay...i saw your page rt now. Dude you have some errors with your div tag config. like body content etc.
     
    egreenr2, May 12, 2011 IP
  5. ApocalypseXL

    ApocalypseXL Notable Member

    Messages:
    6,095
    Likes Received:
    103
    Best Answers:
    5
    Trophy Points:
    240
    #5
    Move the CSS to a external file then go with a div layout .
     
    ApocalypseXL, May 13, 2011 IP
  6. shofstetter

    shofstetter Well-Known Member

    Messages:
    178
    Likes Received:
    7
    Best Answers:
    1
    Trophy Points:
    120
    #6
    Thanks for the help switching to a div layout worked with some minor fixes to get everything to scale correctly. I plan to move the css to an external file once I finish making changes. It is easier to work on having it all in the same file to start with.
     
    shofstetter, May 13, 2011 IP
  7. Chmarus

    Chmarus Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Now your code is looking really nice but add some indentations. They help in debugging and makes your code much readable for other ppl
     
    Chmarus, May 13, 2011 IP