How to make main content div fill screen height using CSS and HTML

position attribute specifies the type of positioning method used for the element (static, relative, absolute, fixed, or sticky).

In the example given below, the height is not specified as a percentage and jQuery is not required

.mainbody{  
   position: absolute;//here we are setting the position of an element as absolute
   top: 30px; /* here we are defining Header Height to 30 px */
   bottom: 10px; /*here we are defining  Footer Height to 10 px */
   width: 100%;// here we are setting the width to 100%
}

The above is the detailed content of How to make main content div fill screen height using CSS and HTML. For more information, please follow other related articles on the PHP Chinese website!