Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
mohamedkhallouq
GitHub Repository: mohamedkhallouq/content
Path: blob/main/files/en-us/web/css/@media/device-height/index.md
6512 views
---
title: device-height slug: Web/CSS/@media/device-height page-type: css-media-feature status: - deprecated browser-compat: css.at-rules.media.device-height
---

{{CSSRef}} {{deprecated_header}}

Note: To query for the height of the viewport, developers should use the height media feature instead.

The device-height CSS media feature can be used to test the height of an output device's rendering surface.

Syntax

The device-height feature is specified as a {{cssxref("<length>")}} value. It is a range feature, meaning that you can also use the prefixed min-device-height and max-device-height variants to query minimum and maximum values, respectively.

Examples

Applying a special stylesheet for devices that are shorter than 800 pixels

<link rel="stylesheet" media="screen and (max-device-height: 799px)" href="http://foo.bar.com/short-styles.css" />

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}

See also