...

View Full Version : CSS & <div> height



justaguynpc
04-12-2011, 10:47 PM
I am relatively new to web design, and have been taking my time learning, and was pretty surprised to read this statement in another forum:

"Height is determined by content and should not be explicitly expressed in CSS."

I was really taken back by this statement. I thought my knowledge of (at least) a couple of the basics was rather solid. Is this statement fundamental, or more of the author's opinion?

This could very well be an "a-ha!" moment for me .....

justaguynpc
04-12-2011, 10:59 PM
For clarity sake, my <body> has neither height or width assigned through its CSS, however my <wrapper> and every other <div> contained in wrapper I had assigned height to. Is this just wrong, or ill-advised?

Excavator
04-12-2011, 11:56 PM
Hello justaguynpc,
The normal behavior of a div element is to enclose it's contents. A width is a typical setting that you would put on an element, just to have control over how and where it displays.

A height is rarely needed though. When you start specifying heights on elements you limit how that element contains it's content. If, for example, your 400px tall container holds 4 paragraphs at 12px text size, what happens to your layout when the person viewing your site on the other end has his browser set to display text at 16px?

justaguynpc
04-13-2011, 12:45 AM
Thanks for your reply, I am just so shocked at never having read this somewhere before. Here I am working away and not thinking that I was doing anything different than what everyone has to do, i.e. continuing to "adjust" / "tweak" the height of my <div>s to get the appearance just "right", naturally addressing each <div> that falls below it.

Jeez! Talk about humbling .....

Cheers

bullant
04-13-2011, 12:48 AM
For clarity sake, my <body> has neither height or width assigned through its CSS, however my <wrapper> and every other <div> contained in wrapper I had assigned height to. Is this just wrong, or ill-advised?

If you need to set a height on an element for some reason that's fine, but you will most probably also have to cater for the situation where the content of that container might not all fit in the set height. One option in that case is to set the overflow css style to auto which will add scroll bars to the element when the content "overflows" the height of the element.

justaguynpc
04-13-2011, 03:38 AM
Thanks bullant.

I'll make a note of that for future reference. Appreciate the information, I'm always open to learning new techniques.

Cheers

bullant
04-13-2011, 04:54 AM
no problem :)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum