Any CSS experts? 'Simple' question on header tags

[HowlingWulf]

Ahhhhh my eyes burn from searching the web for help.

I want to have the very top of my page have this centered:
HEADER ONE - HEADER TWO

with of course header one the <h1> and header two the <h2>.
I'll have an image underneath it and I want no padding in between the header text and the image. Thats it. Hope it makes sense.

[DangerDave]

HW, is this what you are looking for...


<style type="text/css">
h1 { display: inline; }
h2 { display: inline; }
</style>

?

DD

[Preacher]

Dave is correct on the diplay type, but you had other needs and with just changing the display type your image will be on the same line as your headers.

Wrap those headers in a div like so



<div id="centerme"><h1>xxx</h1><h2>yyy</h2></div>



Another reason you should wrap those headers in a div, is because changing the display type to inline will now force the size of the header tags to be the actual width of the text, so adding a text-align of center to the headers won't align them correctly.



h1, h2 {display: inline; margin-bottom: 0;}
div#centerme {text-align: center;}



Make sure your image is not in that div. Then just center your image as you normally would on the next line. I wouldn't recommend css for that unless you know what you are doing because FF & IE render differently. |thumb

[HowlingWulf]

thanks guys the inline was what I needed! I knew this was the right place to ask. :D