Loading ...
Sorry, an error occurred while loading the content.

Can Anyone Help With CSS Problem Please .....?

Expand Messages
  • langdon200510
    I have used A Great CSS Horizontal Drop-Down Menu scripting by Tedd Sperling on my website and it is working very well indeed. I have tried altering various
    Message 1 of 1 , Jul 21, 2010
    • 0 Attachment
      I have used "A Great CSS Horizontal Drop-Down Menu" scripting by Tedd Sperling on my website and it is working very well indeed. I have tried altering various items in the thirst for knowledge and have been impressed with how quickly I have or are becoming acquainted with it.

      I contacted the author who emailed back saying that he doesn't have the time to help.

      One slight problem that I am experiencing and this is nothing to do with the scripting as such. Because I have so many drop down menus on my website:

      URL: http://www.ofinterest2me.com

      I am going to add another tier to the drop downs but also would like to know, how to make the drop downs indicate and drop to the left instead of the right on the last column. PHOTOS.

      I am no programmer by any stretch of the imagination, but do try to make the website look something like interesting to others.

      Hope that someone can help

      menuh.css after signature

      With kindest regards,

      Jim (UK)
      ----------------


      #menuh-container
      {
      position: absolute;
      top: 1em;
      left: 1em;
      }

      #menuh
      {
      font-size: small;
      font-family: arial, helvetica, sans-serif;
      width:100%;
      float:left;
      margin:3em;
      margin-top: 5.5em;
      }

      #menuh a
      {
      text-align: center;
      display:block;
      border: 1px solid #555;
      white-space:nowrap;
      margin:0;
      padding: 0.3em;
      width: 8.5em; /* this added by jim */
      }

      #menuh a:link, #menuh a:visited, #menuh a:active /* menu at rest */
      {
      color: white;
      background-color: #0000cd;
      text-decoration:none;
      }

      #menuh a:hover /* menu on mouse-over */
      {
      color: white;
      background-color: #6495ed;
      text-decoration:none;
      }

      #menuh a.top_parent, #menuh a.top_parent:hover /* attaches down-arrow to all top-parents */
      {
      background-image: url(navdown_white.gif);
      background-position: right center;
      background-repeat: no-repeat;
      }

      #menuh a.parent, #menuh a.parent:hover /* attaches side-arrow to all parents */
      {
      background-image: url(nav_white.gif);
      background-position: right center;
      background-repeat: no-repeat;
      }

      #menuh ul
      {
      list-style:none;
      margin:0;
      padding:0;
      float:left;
      /* width:9em;*/ /* width of all menu boxes */
      /* NOTE: For adjustable menu boxes you can comment out the above width rule.
      However, you will have to add padding in the "#menh a" rule so that the menu boxes
      will have space on either side of the text -- try it */
      }

      #menuh li
      {
      position:relative;
      min-height: 1px; /* Sophie Dennis contribution for IE7 */
      vertical-align: bottom; /* Sophie Dennis contribution for IE7 */
      }

      #menuh ul ul
      {
      position:absolute;
      z-index:500;
      top:auto;
      display:none;
      padding: 1em;
      margin:-1em 0 0 -1em;
      }

      #menuh ul ul ul
      {
      top:0;
      left:100%;
      }

      div#menuh li:hover
      {
      cursor:pointer;
      z-index:100;
      }

      div#menuh li:hover ul ul,
      div#menuh li li:hover ul ul,
      div#menuh li li li:hover ul ul,
      div#menuh li li li li:hover ul ul
      {display:none;}

      div#menuh li:hover ul,
      div#menuh li li:hover ul,
      div#menuh li li li:hover ul,
      div#menuh li li li li:hover ul
      {display:block;}

      /* End CSS Drop Down Menu */
    Your message has been successfully submitted and would be delivered to recipients shortly.