Heading tags (e.g.

,

) are block-level elements. Unless defined, their width property should* be 100%. The tag is an inline element and is handled differently.

I would recommend reading through the CSS specification for exact details. The width property specifically should help resolve your problem.

Something i find useful is to enable the border on specific tags to understand how the page is being rendered. This is really handy when dealing with complex nested margins and paddings.

_{* Not all browsers are created equal}

[Edited by - Exide on December 30, 2008 8:34:11 PM]

Instead of enabling the border, try fireBug, you won'tregret it.

A free dev plug-in for firefox, it shows the borders of any page element you click on. And you can make changes to the code (html, js, css et all) to see what happens before actually saving or changing the original code.

to sort the above you just have to add the width element:

width:50%

i did this before posting but it did something unexpetced so i paniced.

ok heres another one.

What am i doing workng

All i would like to do is display 3 divs with their background

im writing

#masthead{
background-image: url(titletop.jpg);
background-repeat: no-repeat;
}
#content{
background-image: url(content.jpg);
background-repeat: no-repeat;
}

#footer{
background-image: url(footer.jpg);
background-repeat: no-repeat;
}


but the bg doesnt show where i declare the div in the webpage at all. How do i get it to do this. See i know a way and thats by adding tons of pdding gigger than the image itslelf. im sure there must be a cleaner way than this, i just cant find it. Any help?

thanks

Hey,

How does your html look, if youve got something similar to this





You will not see the divs as there is no content in them so their height will be 0. A div will expand vertically to fit all the content within it. You can manually set the heights of the div using the css height or min-height property.

Height will give you a fixed height, min-height will give you a minimum height always, but allows the div to expand vertically past this value. IE6 doesn't support min-height, but treats the height property like the min-height one.

Darren

fantastic mate. Thanks for that, i didnt realise css worked like that. I thought it was like if you declared the div to have a bg it stored it and displayed it. . . been working with wndclassex for too long and storing sizes so im overthinking everything these days . . i am quite the noob:/