adjusting background image for header

this is my site here.

is there a way to adjust the teal splash background image for the headers so that it will adjust in accordance to the character length of the header?

for example, if you take the h2 or h3 headers, is there a way to shrink the image so that it is only as wide as the header itself?

 

You mean the header text right?

Just put in the css of the H2

width: auto;

It could also use some padding-top.

Thomas

 

I like to float em and add some padding. But you can't change the size of the image itself only what part shows. So it will only display half or w/e the lenght of the text is. You can also change the font size of all h's to be the same height...

 

007-I'm not sure I understood what you were saying. Are you saying that adding padding will help determine the length of the background image? I tried that and it didn't work.

 

You need to add the background to the h2 class, i'd add padding to the h2 also so the background shows more each side of the h2 text.

 

he image was already added to the h2 way before hand so I don't know what you are referring to;

h1, h2, h3, h4, h5, h6 { 
	color: #000000;
	margin: 0 0 10px 0;
	background: transparent url(images/bg_h2.png) no-repeat left center;
	width: auto;
	height: 38px;
	}

Code (markup):

 

adding a background is:

background-image: url ("mysite.com");

 

I meant something like that here note its a quick whipup. Din't really check your code...