Hi

I'm trying to have two images in both sides of the Sidebar title, to do that I wanted to use this :

#Sidebar h3 {
clear: both;
text-transform: lowercase;
color: #000;
font-weight: 700;
font-size: 1.4em;
margin: 0 0 0px 0;
text-align:center;
background: transparent url(../images/side_menu_black_lg_rectangle.gif) no-repeat center left;

}

and

#Sidebar h3 span {
clear: both;
text-transform: lowercase;
color: #000;
font-weight: 700;
font-size: 1.4em;
margin: 0 0 0px 0;
text-align:center;
background: transparent url(../images/side_menu_black_lg_rectangle.gif) no-repeat center right;

}

but it doesn't work.

Yhe weird thing is that I used the same technique for the main menu and it work (see below) :

#Navigation ul li a:hover {
background: #000 url(../images/left_hook.gif) no-repeat left center;
color: #fff;
cursor: pointer;
}

and
#Navigation ul li a:hover span {
background: #000 url(../images/right_hook.gif) no-repeat right center;
cursor: pointer;
}

I need help on that

Thanks

Thomas

What I would do to debug is to simplify the css.

For example there is a lot of duplication in the two elements. #Sidebar h3 and #Sidebar h3 span. The span will inherit the h3 values. I would also remove the clear:both from both statements, and see what that does.

#Sidebar h3 {
text-transform: lowercase;
color: #000;
font-weight: 700;
font-size: 1.4em;
margin: 0;
text-align:center;
background: transparent url(../images/side_menu_black_lg_rectangle.gif) no-repeat center left;
}

You may want to add a padding-left style to make room for the image on the left. Also if some of these same styles are already specified in a higher up element you don't need to replicate them here (e.g., color: #000).

#Sidebar h3 span {
background: transparent url(../images/side_menu_black_lg_rectangle.gif) no-repeat center right;
}

You may want to add a padding-right style to the span id to position the image on the right.

Hopefully this is of some help,
Sam

For somewhat related tutorial check out http://veerle.duoh.com/blog/comments/placing_a_css_background_image_horizontally_right_on_an_h2_using_a_span_ele/