I am still feeling my way around CSS so this may be simple but I cannot find the answer. I have installed Nice Menus and have it in the sidebar as a horizontal menu. It works fine except when you use IE, the arrow image is pushing itself across when there is a third level submenu. Actually, what is really happenning is the submenu is appearing behind the top level menu item so the arrow image from the top level menu is showing halfway through the text of the submenu items. This only happens in IE - it is perfectly fine in Firefox. I have attached a picture so you can see what I mean and the CSS is listed below.

Thanks for any help and advice :)

CUSTOM NICEMENU CSS

/* $Id: nice_menus_default.css,v 1.1.2.5 2007/10/29 16:35:34 add1sun Exp $ */
/*
  This is the default layout template for nice menus, and will provide
  a starting point for the look of your menus. To customize, it's
  recommended to create a custom CSS file using this file as a template,
  then configure the module to use your custom CSS file
  (this is done in the global settings tab of the theme administration.)

  To help understand the CSS, the HTML looks like this, where
    x is a number;
    TYPE is down/left/right;
    PATH is the menu path such as node/343;
    MID is the menu id such as 33):
  <ul id='nice-menu-x' class='nice-menu nice-menu-TYPE'>
    <li id='menu-MID' class='menu-path-PATH'><a href='#'>This is a menu item</a></li>
    <li class='menuparent menu-path-PATH'><a href='#'>A submenu</a>
      <ul...><li...>...</li>
      </ul>
    </li>
    ...
  </ul>

  If you have more than one nice-menu and want to target a particular one,
  use its id (e.g. ul#nice-menu-2).

  See README.txt and the handbook page (http://drupal.org/node/185543)
  for some CSS customization examples.
*/

/******************************
 Global CSS for ALL menu types
******************************/

/* Set The text colour and padding for the nice menu links */
ul.nice-menu a {
  padding: 0.3em 5px 0.3em 5px;
/*  color:#FFFFFF; */
  text-decoration:none;
}
ul.nice-menu li a.active { 
  color:#ffffff;
  text-decoration:none;
  font-weight: bold;
}
/* Make hovered links white  colour */
    ul.nice-menu li a:hover {
    color: #6495ED;
  }

/* Overrides for Garland header. */
#header-region ul.nice-menu li {
  margin: 0;
  /* Padding rules are needed to deal with Garland's header line-height. */
  padding-top: 0.1em;
  padding-bottom: 0.1em;
  background: none;
}

ul.nice-menu ul,
/* Repeat for Garland header. */
#header-region ul.nice-menu ul {
  top: 1.8em;
  left: -1px;
  border: 0;
  border-top: 0;
  margin-right: 0;
}

/* Override for Garland header. */
#header-region ul.nice-menu ul {
  top: 1.7em;
}

ul.nice-menu ul li {
  width: 12.5em;
}

/******************************
 VERTICAL (left/right) menus
******************************/

/* This is the default width of all vertical menus. */
ul.nice-menu-right, ul.nice-menu-left,
ul.nice-menu-right li, ul.nice-menu-left li {
  width: 95%;
}

/* VERTICAL menus where submenus pop RIGHT (default). */
ul.nice-menu-right ul {
  width: 95%;
  left: 12.5em;
  top: -1px;
}

ul.nice-menu-right ul ul {
  width: 95%;
  left: 12.5em;
  top: -1px;
}

ul.nice-menu-right li.menuparent,
ul.nice-menu-right li li.menuparent {
background: #e5ecf9 url(img/arrow-right.gif) right center no-repeat; }

ul.nice-menu-right li.menuparent:hover,
ul.nice-menu-right li.over,
ul.nice-menu-right li li.menuparent:hover,
ul.nice-menu-right li li.over {
background: #e5ecf9 url(img/arrow-right.gif) right center no-repeat;

}

/* VERTICAL menus where submenus pop LEFT. */
ul.nice-menu-left li ul {
  width: 95%;
  left: -12.65em;
  top: -1px;
}

ul.nice-menu-left li ul li ul {
  width: 95%;
  left: -12.65em;
  top: -1px;
}

ul.nice-menu-left li.menuparent,
ul.nice-menu-left li li.menuparent {
background: #e5ecf9 url(img/arrow-left.png) left center no-repeat;
}

ul.nice-menu-left li.menuparent:hover,
ul.nice-menu-left li.over,
ul.nice-menu-left li li.menuparent:hover,
ul.nice-menu-left li li.over {
background: #e5ecf9 url(img/arrow-left.png) left center no-repeat;
}

ul.nice-menu-left a, ul.nice-menu-left ul a {
  padding-left: 14px;
}

/******************************
 HORIZONTAL (down) menus
******************************/

ul.nice-menu-down {
  float: left;
  border: 0;
}

ul.nice-menu-down li {
  border-top: 1px solid #ccc;
}

ul.nice-menu-down li li {
  border-top: 0;
}

ul.nice-menu-down ul {
  left: 0;
}

ul.nice-menu-down ul li {
  clear: both;
}

ul.nice-menu-down li ul li ul,
/* Repeat for Garland header. */
#header-region ul.nice-menu-down li ul li ul {
  left: 12.5em;
  top: -1px;
}

ul.nice-menu-down .menuparent a {
  padding-right: 15px;
}

ul.nice-menu-down li.menuparent,
/* Repeat for Garland header. */
#header-region ul.nice-menu-down li.menuparent {
  background: #e5ecf9 url(img/arrow-down.png) right center no-repeat;
}

ul.nice-menu-down li.menuparent:hover,
ul.nice-menu-down li.over,
/* Repeat for Garland header. */
#header-region ul.nice-menu-down li.menuparent:hover,
#header-region ul.nice-menu-down li.over {
  background: #e5ecf9 url(img/arrow-down.png) right center no-repeat;
}

ul.nice-menu-down li li.menuparent,
/* Repeat for Garland header. */
#header-region ul.nice-menu-down li li.menuparent {
background: #e5ecf9 url(img/arrow-right.gif) right center no-repeat;
}

ul.nice-menu-down li li.menuparent:hover,
ul.nice-menu-down li li.over,
/* Repeat for Garland header. */
#header-region ul.nice-menu-down li li.menuparent:hover,
#header-region ul.nice-menu-down li li.over {
 background: #e5ecf9 url(img/arrow-right.gif) right center no-repeat;
}

  /* Get rid of the borders and background colour for all top-level menu items: */
  ul.nice-menu,
  ul.nice-menu ul,
  ul.nice-menu li {
    border: 0;
    background: none;
	 border-top-width: 1px;
	 border-top-style: dashed;
	 border-top-color: #cccccc;
}

  ul.nice-menu-right li.menuparent,
  ul.nice-menu-right li li.menuparent{
    /*  background: #e5ecf9 url(arrow-right.gif) right center no-repeat; */
  }

  li.menuparent li, li.menuparent ul {
    background: #eee;
  list-style: none;
  }

 
CommentFileSizeAuthor
nice_menu_ie_bug.png12.76 KBdrupalferret

Comments

add1sun’s picture

Category: bug » support

Not a bug if it doesn't happen in the core themes.

add1sun’s picture

Status: Active » Closed (fixed)

Over a month with no response. Closing.