Hi

 

I would like to be able to place an image I have created so it appears underneath ny <h2>/<h3> tags at the beginning.

 

The image I can resize but I want it to be a bit bigger than the pre-defined size of the headers. What seems to happen when i use the following code is show the image but only one part of it rather than having the swirling bits being much larger - I'm hoping that makes sense when you see the image.

 

h2 {

background-image:url(..\floral95.png);

background-repeat: no-repeat;

padding: 0;

margin:0;

}

 

the html is:

<h2>Private Functions and Corporate Event Options</h2>

<p>random blurb</p>

<h3>Weddings</h3>

 

 

I have attached the image:floral97

 

If anyone can help that would be great.

 

Thanks

 

Beth

Not entirely sure if I understand what you want, but if you increase padding, it would show the whole image?

Thanks

 

Adding padding works to make the picture show but it also creates lots of extra space around that header, more than I want. Is there anyway of getting the image to be under the h2 tag but also overlap the other paragraphs?

 

(I've tried to make what I want it to look like in photoshop.)

 

 

Beth

Set a height to the H2, and use negative margins.

Thanks, that works quite well.

 

Enhancing this further, if I reduce the margin on the left so it would start more over on the left (overlapping the navigation <div>) it actually disapears underneath it. Any ideas how I can achieve that. My thoughts are z-index ( have tried it but can't work out why it won't work, but surely it must?!) or absolute position, (haven't tried this but a. will it still disappear under div and b. will it move in relation to the <h2> tag if more content is added or if the screen resolution is altered?)

 

Thanks

 

Beth