none
drop down menu behind page text RRS feed

  • Question

  • I've followed the instructions from "The No-Code Way to a Pure CSS Horizontal Drop-Down Menu with Expression Web" and placed it in a dynamic template. The drop down menu seems to work fine until it drops over text, etc and then it is showing behind paragraph text.

    Please see page in question here: http://www.theoldboardco.co.uk/default.htm

    Monday, March 26, 2012 1:57 PM

Answers

  • Set the z-index to bring the drop-down on top of the content.

    But--before you do anything, I'd rethink that menu structure. What's the most important thing in the menu? I think it's the links to your products. But your product links are hidden in a drop down. Strictly from a marketing perspective (which is what the site is for), I think that the visitor should always have those links staring them in the face.

    Also, the menu instructions that you followed have been an ongoing source of problems for people. Buried at the very end of them is the warning that this menu does not work in some browsers, most notably IE 6 and earlier. Now, IE6 is old, but it's still in common use in many parts of the world and in industry (especially large corporations). That menu won't work for anyone visiting your site using IE6 and browsers that don't support :hover pseudo-class.

    There are many better CSS drop-down menus available on the web that work well cross-browser (do a search for them), and look particularly at www.cssplay.co.uk


    Comic Sans walks into a bar. The bartender says, "Get out! We don't serve your type."

    • Marked as answer by banana grafix Friday, March 30, 2012 11:44 AM
    Monday, March 26, 2012 2:48 PM

All replies

  • Set the z-index to bring the drop-down on top of the content.

    But--before you do anything, I'd rethink that menu structure. What's the most important thing in the menu? I think it's the links to your products. But your product links are hidden in a drop down. Strictly from a marketing perspective (which is what the site is for), I think that the visitor should always have those links staring them in the face.

    Also, the menu instructions that you followed have been an ongoing source of problems for people. Buried at the very end of them is the warning that this menu does not work in some browsers, most notably IE 6 and earlier. Now, IE6 is old, but it's still in common use in many parts of the world and in industry (especially large corporations). That menu won't work for anyone visiting your site using IE6 and browsers that don't support :hover pseudo-class.

    There are many better CSS drop-down menus available on the web that work well cross-browser (do a search for them), and look particularly at www.cssplay.co.uk


    Comic Sans walks into a bar. The bartender says, "Get out! We don't serve your type."

    • Marked as answer by banana grafix Friday, March 30, 2012 11:44 AM
    Monday, March 26, 2012 2:48 PM
  • Thanks for the input, I've managed to sort the problem now, I'm new to CSS so expecting a few blips along the way.
    • Proposed as answer by Bahareh20 Thursday, March 6, 2014 10:16 AM
    Wednesday, March 28, 2012 4:32 PM
  • Hi, I've the same problem as you had, would you please let me know how did you solve it?!

    when the drop-down menu opens, it goes to the background text and not accessible!


    Thursday, March 6, 2014 10:18 AM
  • This is a dead thread that's two years old and has already been marked as answered.

    There are a few universal rules across the Web:
    1. Never resurrect a dead thread
    2. Never hijack someone else's thread with your question.
    3. Always read the forum's FAQ before making your first post (if you had, you would have read not to resurrect a dead thread and that in order to address display issues, you must post a link to the page in question).

    Also, you marked banana grafix's last post as the answer, and it clearly is NOT the answer; it's just him saying Thanks--two years ago. That didn't answer anything. And he hasn't posted in over a year; why would you think he'd see your question?

    Please unmark it your proposed answer, as it confuses people who come along later.

    The real answer had already been marked--by the guy who asked the question. It should be clear that that solved his problem. Read it and do what it instructed. if that doesn't work, read the Forum FAQ, follow the instructions, and post your own question.


    Things Liberal Arts graduates never like to hear:
    “…which means you are going first in Double Jeopardy.”

    Thursday, March 6, 2014 1:21 PM