#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2005
    Location
    Rochester NY
    Posts
    18
    Rep Power
    0

    Suckerfish has failed, need help


    Hi all

    This is the place I need help with
    http://www.simon.rochester.edu/source%20files/newpage/web5/
    at the white navigation bar on the top, the dropdown is aligned to the top right corner rather than bottom left. I looked up suckerfish page and found out that's what IE does, so I added the fix:

    top:100%;
    left:0;

    to #topnav li ul

    However, nothing happens. I tried a slew of other things, nothing seems to change that bit. Can anyone help?

    Also if you notice, the white bar navigations are images, those images get compressed for some damn reason in IE. Mozilla doesn't have any of these problems.

    I implemented IE7 patch as well
  2. #2
  3. from the lab...
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Nov 2004
    Location
    the land of wind and ghosts
    Posts
    1,845
    Rep Power
    565
    could have something to do with requireing an invisible 'background image'.

    try this
    Code:
    ul {
    	margin: 0;
    	padding: 0;
    	list-style: none;
    	width: 92px;
    	border-bottom: 1px solid #666666;
    	backgound-image: url(images/no-pic.gif);
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2005
    Location
    Rochester NY
    Posts
    18
    Rep Power
    0
    Originally Posted by ran_dizolph
    could have something to do with requireing an invisible 'background image'.

    try this
    Code:
    ul {
    	margin: 0;
    	padding: 0;
    	list-style: none;
    	width: 92px;
    	border-bottom: 1px solid #666666;
    	backgound-image: url(images/no-pic.gif);
    Hmm...doesn't work, I'm not sure why the images are compressed there. Because if I hover my mouse over it, it'll become normal again. Also it's random. If I refresh a couple of times, some of the images will become normal and eventally I'll get all of them to be normal if i just hit refresh enough times.
  6. #4
  7. from the lab...
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Nov 2004
    Location
    the land of wind and ghosts
    Posts
    1,845
    Rep Power
    565
  8. #5
  9. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Try setting a width on #topnav. It's not Suckerfish's failure; it's your implementation not compensating for IE's oddities.

    top:100% is not what you want.
    Try setting it to the height of the <li>, maybe top:25px.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2005
    Location
    Rochester NY
    Posts
    18
    Rep Power
    0

    Unhappy


    Originally Posted by Kravvitz
    Try setting a width on #topnav. It's not Suckerfish's failure; it's your implementation not compensating for IE's oddities.

    top:100% is not what you want.
    Try setting it to the height of the <li>, maybe top:25px.
    Well I figured that the top:100% might be my problem. So I tried all sorts of things. But no matter what I put that top to be, the fly out is still on the right hand side of the menu button. It didn't matter what top is, nothing changes. I also tried your suggestion at giving a width to topnav, nothing changes. I'm at my wit's end.
  12. #7
  13. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2005
    Location
    Rochester NY
    Posts
    18
    Rep Power
    0
    This problem seems to be solved.

    karvvitz pointed me to the correct track.

    #topnav li>ul { top:25px; left:0; }
    should replace #topnav li>ul { top:auto; left:auto; }

    and position:relative should be added to topnav li

    auto just doesn't work very well

IMN logo majestic logo threadwatch logo seochat tools logo