search

Home >Web Front-end >CSS Tutorial >How Can I Set a Div's Height to 100% While Maintaining a DOCTYPE?

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

Barbara Streisand
Barbara StreisandOriginal
2024-12-27 19:59:15164browse

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!

css if while include auto Property viewport
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：How Can I Create a Responsive Grid of Squares with Centered Content Using CSS?Next article：How Can I Create a Responsive Grid of Squares with Centered Content Using CSS?

Related articles

See more