How Can I Set a Div's Height to 100% While Maintaining a DOCTYPE?

CSS Height Property, Percentage Values, and DOCTYPE

Setting Div Height to 100%

To fill the div with 100% height without removing the DOCTYPE, declare a height on the root element:

Quirks Mode and Percentage Heights

Removing the DOCTYPE switches the browser from standards mode to quirks mode. In quirks mode, percentage heights of child elements are measured relative to the viewport if the parent element has height: auto. In standards mode, they are treated as height: auto.

TL;DR

Always include a DOCTYPE to render the document in standards mode. Use the following DOCTYPE:

The above is the detailed content of How Can I Set a Div's Height to 100% While Maintaining a DOCTYPE?. For more information, please follow other related articles on the PHP Chinese website!