I'm having a strange problem with CSS for a header section which I can't figure out. I should say this is for the header of a vbulletin forum so there may be complications there, but even so, the css problem seems fairly simple, if only I had the right knowledge...
I have this code in my main html page:
<img src="http://www.example.com/images/image1.jpg" alt="Header Image" width="700" height="50" />
<p><a href="http://www.example.com">Home</a> |
<a href="http://www.example.com/one.htm">Section One</a> |
<a href="http://www.example.com/two.htm">Section two</a> |
And this code in my css:
What the code produces is the header image with the navigation links superimposed over the top of the image. This isn't what I want - I want the image at the top and then the links underneath.
However, when I remove this line:
the code works fine, and I get the image at the top and the links underneath, rather than the second div superimposed over the first one.
And I can't for the life of me figure out why...is there some rule of css that might be producing this phenomonen? I could just leave the code without the #headerimage line, but I feel like I need to understand why it is working this way.
Any help gratefully received!