Re: [css-d] custom background image on menu items

Thu, 24 Sep 2009 20:56:11 -0700 

Bob Meetin wrote:
> I am trying to set custom background images for menu items on a menu 
> auto-generated through a CMS.  Them CMS gives both a class and an ID to 
> each menu item, each has a numerical suffix.  Example:
>
> <div id="whatever">
> <ul>
>   <li >
>     <a 
> href="index.php?option=com_content&amp;view=article&amp;id=99&amp;Itemid=54" 
> class="menu-item3" id="menu54" title="CONTACT"><span 
> class="menu-title">CONTACT</span></a>
>   </li>
>
>   <li >
>     <a href="index.php?option=com_user&amp;view=login&amp;Itemid=58" 
> class="menu-item4" id="menu58" title="DEALER/REP"><span 
> class="menu-title">DEALER/REP</span></a>
>   </li>
>
>   ...
>   ...
>
> </ul>
> </div>
>
> The relevant section of the stylesheet looks like:
>
> #ja-cssmenu li a {
>   background: url(/images/blu-glossy-spheres-light-30.png) no-repeat 
> -2px -29px;
> }
>
> The above style will work to give every link the blue image, but I don't 
> want that so I commented out the background and tried to apply a custom 
> class or id to the individual links.  I thought something like one of 
> the following should work, keying off of (class="menu-item3" 
> id="menu54") but no image appears:
>
> #menu54 .menu-item3 li a  {
>   background: url(/images/blu-glossy-spheres-light-30.png) no-repeat 
> -2px -29px;
> }
>
> .menu-item3 #menu54 li a  {
>  background: url(/images/blu-glossy-spheres-light-30.png) no-repeat -2px 
> -29px;
> }
>
> #menu54 li a  {
>   background: url(/images/blu-glossy-spheres-light-30.png) no-repeat 
> -2px -29px;
> }
>
>  .menu-item3 li a  {
>   background: url(/images/blu-glossy-spheres-light-30.png) no-repeat 
> -2px -29px;
> }
>
> #menu54 a  {
>   background: url(/images/blu-glossy-spheres-light-30.png) no-repeat 
> -2px -29px;
> }
>
> .menu-item3 a  {
>   background: url(/images/blu-glossy-spheres-light-30.png) no-repeat 
> -2px -29px;
> }
>
> What am I missing?
>
> -Bob
> ______________________________________________________________________
> css-discuss [[email protected]]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
>   
If you would give us a URL to work with it will be easier to help you, 
also what are the differences between each button you are trying to 
achieve, is it different for each and every button or just a few?
Thanks,
Brian
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to