Distinguishing between min-height and height in CSS


Suppose we set the height of the body of a page to be 100%.  Then what happens is that the body’s height takes up 100% of the viewable area.  If the content is taller than 100% of the screen (i.e., a scrollbar is needed), then body tag will not extend to that height.  So how do we get around this limitation?  We set min-height instead of height.  min-height sets the height of the page to be 100% of the viewable area when the content is smaller than the screen height.  If the content is bigger then the screen height, then its actual height is used.


Comments (0)

Skip to main content