Since tundewoods has stolen my thunder by taking away from me "part 3", I will skip to part 4.

Many atimes, I will see sites that have their contents "bleed" through their DIV tags, for those who use CSS. In particular, this problem tends to present itself in FF and not IE. There is a reason for this:

In FF, once you set the height of a div to say, 600px, that div will never be flexible in height which means that if content is more than the 600px height, it bleeds through that DIV. In IE on the other hand, the 600px is regarded as a minimum height and so if the content is more than the 600px, the DIV expands accordingly. However, if the content equates to a height of 595px for instance, the height of the DIV remains the same at 600px and you will notice the 5px (in this case) gap.

How to fix the problem as a cross-browser solution?
You could declare your style such that it looks like so:

div {
min-height: 600px;
height: auto !important;
height: 600px;
}

The "!important" part is a FF hack and IE 6 and below will ignore this line and use the "min-height" and "height: 600px" lines. The min-height just means exactly what it says, it's a minimum height.

Caveat:
Note that the line with "height: 600px !important" comes before the regular line "height: 600px". This is on purpose. For the "!important" rule to work properly, you must declare it before its equivalent IE counterpart.

Did you find this useful? If so, I will post more.

Thanks

nice yawa
I have been having that problem when I do a my design with no real content I always want to make it big so I set a height but when I have dynamic data I always change the height to auto
so during css and html design work I do

height: 600px;

and during programming and dynamic content I do

height: auto;

it was a mad fix for me but recently my2cent toldme of min-height and you have just comfirmed now I wont have to be switching the css
thanks

Absolutely fantastic.usually i don't specify height, unless i need to.well done. As for the 'thunder stolen', be prepared to see more.

yawa, i just came across your tutorial - ive been willing to delve into css fully, until now my use of css has not included divs but i think its becoming inceasingly important that i go on table -less designs. I dont mind if u can start a thread or a personal tutorial on CSS especially in the areas that concerns divs.

Im eagerly awaiting your response.

@webemarald,

Stay tuned. That tutorial is on its way

I am in the process of writing an Ebook. 20 chapters. 20 short lessons. 3, based on lessons on here, already written. I will alert you all as to when I am done, pricing, etc.

Thanks,

u say pricing ?

yes sir. I said pricing. But not to worry, it's not something you can't afford

It would be the equivalent of the money our elders give us when we are about to leave for the village, what they call, "take for groundnut"

CSS hell hacked, wow that's so cool,

every web designer has that nasty / firefox wahala

Thanks for the tutorial or will i say Hack

As of today, July 8, 2008, I am done with 10 chapters of 16. I originally wanted to stop at 10 but after each chapter, another chapter comes to mind, based in part on what I see on this board. I should be done no later than 2 weeks from now.

Stay Tuned!