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

    Join Date
    Oct 2005
    Posts
    8
    Rep Power
    0

    Drop Down Menu Help


    Alright, I've started to design the other pages on my site. I had to change some things in the code in order for my design to work properly. I didn't have it set up correctly before. So everything works the way I want it to now...except for the drop down menu. I am only a beginner with CSS and do not know much about it. I can't figure out what it is I did that made the navigation stop working. If maybe somebody that is more experienced than myself can take a look at it to see what I did, I would really appreciate it.

    Oh yea, here is the link to the beggining stages of my "about" page:
    About

    Keep in mind, nothing is really for sure yet. I just want to get the coding done, so if you think the page could use some sprucing up, you're not alone. As of now the site works best in Firefox and the drop down menu should appear when "Portfolio" is hovered over.

    Here is the link to the CSS:
    CSS

    Thanks
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,126
    Rep Power
    4309
    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).
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2005
    Posts
    8
    Rep Power
    0
    I appreciate the help. Although, as I stated, I am a beginner with CSS. I am not quite sure what exactly I am missing. I tried fixing it, but it only got even more messed up.


    Thanks,

    Casey
  6. #4
  7. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,126
    Rep Power
    4309
    I suggest you scrap the CSS code for the menu you have now, copy the CSS code from one of the examples and then modify it one property at a time until you get yours how you want it.
    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).
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2005
    Posts
    8
    Rep Power
    0
    I've tried copying the code and changing it little by little...this still doesn't work. It isn't that my menu doesn't work, the problem is it is being covered up by everything below the navigation. I tried aligning the navigation to one side and when I hover over the link the menu appears, but part of it is covered. Isn't there something I can add to the code to just make the drop down appear above everything else?

    Thanks
  10. #6
  11. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,126
    Rep Power
    4309
    Ah, ok. Try specifying a z-index on #nav.

    Code:
    #nav {
    	height:28px;
    	width:755px;
    	margin: 0 auto 0 auto;
    	position: relative;
    	z-index: 900;
    }
    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).
  12. #7
  13. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2005
    Posts
    8
    Rep Power
    0
    That was exactly what I was looking for. Thanks!
  14. #8
  15. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2005
    Posts
    8
    Rep Power
    0
    Alright, now the menu appears, but there are some display problems in IE. Is there an easy fix to this, or will I have to recode the menu?

    Thanks
  16. #9
  17. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,126
    Rep Power
    4309
    It looks fine in IE6. Are you talking about IE5.x/Win?
    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).
  18. #10
  19. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2005
    Posts
    8
    Rep Power
    0
    Now I am really confused. In order for the ":hover" function to work in IE I added the "csshover.htc" file found here:

    http://www.xs4all.nl/~peterned/csshover.html

    In the head I have "<base href="http://www.photochops.net/photochops/""

    The hover works great in IE as long as "www" is in the address bar. But if the "www" is gone (http://photochops.net/photochops/) then the hover does not work.

    Does anybody know a way to fix this? If I must explain it better let me know.

    Thanks
  20. #11
  21. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,126
    Rep Power
    4309
    Have you tried specifying the absolute URL?

    Code:
    http://www.photochops.net/photochops/css/csshover.htc
    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).
  22. #12
  23. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2005
    Posts
    8
    Rep Power
    0
    I tried that and it still doesn't work. However, it works if I change it to "http://photochops.net/photochops/css/csshover.htc", but then it doesn't work when "www" is present. Any ideas?

    Thanks.
  24. #13
  25. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,126
    Rep Power
    4309
    You could use PHP to set the URL dynamically.
    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).

IMN logo majestic logo threadwatch logo seochat tools logo