CSSMenu Horiz. .menuparent li's not displaying bg images.

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Locked
fuzzy_one

CSSMenu Horiz. .menuparent li's not displaying bg images.

Post by fuzzy_one »

CMSMS 1.01  Working up a template derived from CSSMenu Horizontal & Two-Column Layout default stylesheets.

I've made a fair few changes to the default sheets, but nothing affecting the various menu uls and lis (except changing bg colors, border colors, etc.)  Then I tried to drop in a little bg image (ye olde arrowe) here:

Code: Select all

#primary-nav ul li.menuparent, 
#primary-nav ul li.menuparent:hover, 
#primary-nav ul li.menuparenth { 
/* arrow for menuparents */
   background-image: url(images/arrow.png); 
   background-position: center right; 
   background-repeat: no-repeat; 
}
But for some freaky reason the image does not display.  I'm using FF 1.5 on Ubuntu (Dapper).  I have copy-pasted the background-image property from the above snippet and paired it with different selectors (in the main layout stylesheet), where it works just fine.  Therefore the path is correct, the image is not corrupt, etc.  I searched this forum but could find no one discussing this exact difficulty (am consequently dreading the inevitable feel-like-an-idiot-because-I-overlooked-something-obvious moment).

So we might as well get it over with ... where did I go wrong here?
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: CSSMenu Horiz. .menuparent li's not displaying bg images.

Post by Dr.CSS »

I think the ul is giving you problems have you tried this...

/* Styling the basic apperance of the menuparents - here styled the same on hover (fixes IE bug) */
#primary-nav li.menuparent,
#primary-nav li.menuparent:hover,
#primary-nav li.menuparenth {
  background-image: url(images/cms/arrow.gif); Not sure about this part, yours may be some where else...
  background-position: center right;
  background-repeat: no-repeat;
}
fuzzy_one

Re: CSSMenu Horiz. .menuparent li's not displaying bg images.

Post by fuzzy_one »

Thanks for the suggestion.  I just tried it.  No joy in FF 1.5.

I've tried both PNG and GIF variants, with "ul li" and just "li".  Nothing works.

BUT, in a reversal of expectation, it renders correctly in IE6 (just checked it on my wife's laptop).  So we're probably dealing with something Gecko-specific.

Has anyone else encountered a similar problem with the CSSMenu stylesheet?  I would assume not, but please shout if you have.

The only unusual thing I can think of about this template is that I've set the pagewrapper div to position: relative so that I could absolutely position an image at the top right corner of the wrapper (enabling it to visually overlap some other divs).  But I've commented out the position: relative to test that theory, and the menuparent arrows still do not appear.

The only other hint I have is a few old references to FF/Gecko having trouble with clearing divs without an explicit height definition.  I assume if this were the problem that other people with Gecko browsers would have found it.  I've changed nothing about the header div other than height, bg-image, and padding; nothing changed about the content div below the nav.

Pretty mystified...
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: CSSMenu Horiz. .menuparent li's not displaying bg images.

Post by Dr.CSS »

try putting a space between    li .men  (the li and the class)
have you a link i can hit?
fuzzy_one

Re: CSSMenu Horiz. .menuparent li's not displaying bg images.

Post by fuzzy_one »

You, sir, are a gentleman and a scholar.

My thanks.

Figured it was something small-yet-necessary.
Locked

Return to “Layout and Design (CSS & HTML)”