Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Drop downs work correctly in Firefox, but not IE

    This is my first posting, I hope this can be a good experience.

    I have created some drop down menus on my site by using DIV tags. When a user rolls over a tag, the style of the underlying div tags changes from Hidden to Visible. Now in Firefox everything works as it should and is displayed correctly. However, when I look in IE, the tags are separated by the same distance of the size of the DIV tags. In other words, IE renders the code as if it is see the DIV tags even though they should be hidden.

    Here is an example:

    http://www.asymethic.com/jamie.php

    the style sheet is: http://www.asymethic.com/asymethic_styles_dev.css
    the js file is: http://www.asymethic.com/asymethic_scripts_dev.js

    My question is: How do I get IE to ignore the underlying DIV tags, and place all the items next to each other?

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    visibility / display

    "visibility: hidden" will cause an element to not be shown; it does however take up the same space as it would be if it were visible.
    The fact the IE behaves differently probably has to do with its incorrect treatment of height.

    If you want the "invisible" element to actually not be there, use "display: none" and "display: block" (in the case of a div) instead. "display: none" will take it out of the normal flow completely.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #3
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you for the quick and kindly response. I tried both the block and the none display options, but did not resolve my issue with IE.

    However, your response makes me think that there is just something wrong in my CSS file. I will keep tweaking with it, but if you have any other ideas, please feel free to respond.

    Thanks again.

  • #4
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Got it. Thanks.

    For anyone who might be having this kind of issue, you need to set the display:none originally, then when you rollover, change that distinct item so that the DIV tag is display:block, or whatever you want to use.


  •  

    Posting Permissions

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