SitePoint Sponsor

User Tag List

Results 1 to 19 of 19
  1. #1
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS dropdown issues

    Hi, you can see the site here: Link

    My issues are:

    1. IE, Opera: dropdowns sometimes get stuck

    2. IE7 also needs the suckerfish to operate properly? I thought li:hover was fixed on IE7?

    Thanks
    Last edited by znebojsa; Aug 2, 2008 at 15:46.

  2. #2
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  3. #3
    SitePoint Wizard Blake Tallos's Avatar
    Join Date
    Jun 2008
    Location
    Cuyahoga Falls, Ohio.
    Posts
    1,511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It seems to me ur links arent even working for some reason?
    Blake Tallos - Software Engineer for Sanctuary
    Software Studio, Inc. C# - Fanatic!
    http://www.sancsoft.com/


  4. #4
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeah, that's because all the other pages haven't been made yet, that's not important.

  5. #5
    SitePoint Wizard Blake Tallos's Avatar
    Join Date
    Jun 2008
    Location
    Cuyahoga Falls, Ohio.
    Posts
    1,511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I just checked in ie7 and the only dropdown menu that is working is your location and your products menu.I dont think “-1″ is supported in ie7. http://jehiah.cz/archive/tabindex
    Blake Tallos - Software Engineer for Sanctuary
    Software Studio, Inc. C# - Fanatic!
    http://www.sancsoft.com/


  6. #6
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeh, they are the only ones which have dropdowns...

    anyway, do the dropdowns sometimes get stuck for you? if you play around with them?

  7. #7
    SitePoint Wizard Blake Tallos's Avatar
    Join Date
    Jun 2008
    Location
    Cuyahoga Falls, Ohio.
    Posts
    1,511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No, they dropdown the way they are supposed to.
    Blake Tallos - Software Engineer for Sanctuary
    Software Studio, Inc. C# - Fanatic!
    http://www.sancsoft.com/


  8. #8
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    If it's based on Suckerfish, then a fix is required for IE7: http://www.builtfromsource.com/2006/...downs-in-ie-7/

  9. #9
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmm, thanks Rayzur, but using that fix makes the dropdowns push the content down when I hover over my menu...

  10. #10
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Hi Z,

    You would be surprised how many threads there are on this issue.

    Here is a thread search for "Dropdown Suckerfish Problem"

    Here is a thread similar to yours from the search above.

    And this is an article from css-class.com called "Sticky Sons of Suckerfish", it goes through all the different variations of the bug.

    Maybe those will point you in the right direction, sorry that I can't diagnose the exact problem you are having right now.

  11. #11
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hey, I managed to fix IE by giving it haslayout, using display: inline-block;

    However Opera9.5 (not 9.2) still has a similar problem which occurs when I zoom in to 200%...

  12. #12
    SitePoint Wizard Blake Tallos's Avatar
    Join Date
    Jun 2008
    Location
    Cuyahoga Falls, Ohio.
    Posts
    1,511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Were happy that you got your dropdown menu fixed. Good job Rayzur
    Blake Tallos - Software Engineer for Sanctuary
    Software Studio, Inc. C# - Fanatic!
    http://www.sancsoft.com/


  13. #13
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    One of the most common solutions to the sticking problem is to add
    Code:
    li:hover{visibility:visible}
    Paul comments on that in the thread I said was similar to yours

    Add it into your nav.css here, After doing that your Opera problem was fixed for me
    Code:
     ul#nav {
        list-style: none;
        float: right;
        margin-top: 40px;
    }
    
    ul#nav li {
        float: left;
        width: 81px;
        text-align: center;
        position: relative;
         z-index:999; /*-- add this --*/
    }
    
    li:hover{visibility:visible} /*-- add this --*/
    
    ul#nav li a {
        width: 51px;
        display: block;
        font-weight: bold;
        padding: 0 15px 51px 15px;
        background: no-repeat 0% 100%;
        color: #666666;
        text-decoration: none;
        cursor: pointer;
    }

  14. #14
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Rayzur:

    I have now updated the site with what I currently have it as.

    Anyway, li:hover{visibility:visible} made Opera better, but still not perfect, on the home page it still isn't perfect, but on other page its fine... Can you spot any reason why?

    Also, adding z-index:999; didn't do anything though, so I've removed it.

    Thank you, all your responses have been greatly appreciated

  15. #15
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Hi Z,

    I'm afraid this Opera zoom problem is getting out of my league. I know Opera does not redraw the page anytime the viewport is resized thus a reload is required for it to redraw the page. I'm not sure if that has anything to do with this though, I tried reloading the page after I zoomed and it had no effect.

    What I am noticing is that the (products) submenu's width is not zooming in proportion like it should.

    I'm sure Paul O'B will pass through here shortly and pin point the problem if it is possible to fix in Opera.

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

    Try giving the nav a width as Opera is more stable when widths are applied to floats.

    e.g.
    Code:
    ul#nav{width:410px}

  17. #17
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Paul,

    wow, I just woke up and decided to check if you had replied, and you had the exact same minute I checked, perfect timing =D

    Anyway, making the width 405px, fixes the problem as you said. I actually don't even need to use li:hover { visibility: visible }

    Thank you very much, dropdown menus are a real nuisance

  18. #18
    SitePoint Addict
    Join Date
    Jun 2007
    Location
    Sydney, Australia
    Posts
    253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    actually, looks like I have to make the ul#nav at least 409px for IE6... otherwise the last link drops down to the next line... no idea why as 81 x 5 = 405.

    Oh well..

  19. #19
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,549
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    otherwise the last link drops down to the next line..
    Yes I noticed that which is why I made it wider Of course you could give IE the auto width if you wanted and didn't mind an extra hack etc.


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
  •