Viewport Meta width=device-width Check

Detects an explicit width=device-width directive in viewport content split on commas or semicolons. Reports duplicate width directives rather than simulating browser viewport resolution.

Description

A viewport meta directive connects a page’s layout viewport to the device width.

A viewport meta directive connects a page’s layout viewport to the device width. Duplicate width directives can make the author’s intent harder to inspect.^[1]

Detects an explicit width=device-width directive in viewport content split on commas or semicolons. Reports duplicate width directives rather than simulating browser viewport resolution.

When to use Viewport Meta width=device-width Check

Use this for the following task: Detects an explicit width=device-width directive in viewport content split on commas or semicolons. Reports duplicate width directives rather than simulating browser viewport resolution.

Prepare the parsed attribute values, element states or ordered local lists requested below. Keep attribute presence separate from value.

How to use Viewport Meta width=device-width Check and understand its results

Prepare the parsed attribute values, element states or ordered local lists requested below. Keep attribute presence separate from value.
Enter content using the field table, then run the tool.
Read hasDeviceWidth, widthDirectiveCount. Interpret flags, units, ordering and placeholder values using the rules below.
Review any reported issue or failed check, correct the supplied values when appropriate, and verify the result in its intended context.

Input field	Meaning	Value type and bounds	Requirement
content	Content	string; maximum text length 100000	Required

Split content on commas or semicolons and trim ASCII whitespace. Count width assignments case insensitively; recognize device-width only when it occupies the complete assignment value.^[2]

hasDeviceWidth = any exact width=device-width directive; widthDirectiveCount = number of width assignments

This summarizes the declared operation. Units, indexing, inclusivity and exceptional cases are explained in the surrounding text.

Output field	Meaning	Value type
hasDeviceWidth	Has Device Width	boolean
widthDirectiveCount	Width Directive Count	integer

json

{
  "input": {
    "content": "width=device-width, initial-scale=1"
  },
  "output": {
    "hasDeviceWidth": true,
    "widthDirectiveCount": 1
  }
}

Limitations and assumptions

The presence flag does not resolve duplicate directives, zoom settings or actual browser layout.

This evaluates supplied local information; it does not fetch a page or run a browser. Malformed requests produce input errors. A successfully evaluated request can still contain false flags, empty result lists or a result outside the supplied threshold; those outcomes have the meanings stated above.

Alternative or Complementary methods

Choose sizes Attribute Width Formula Lookup for this operation: Resolves the first matching sizes clause from parsed media flags and already-resolved nonnegative CSS pixel lengths. If none matches, source size defaults to viewport width (100vw). Auto sizes and CSS parsing are outside this profile. For a complementary task, use picture/source Art Direction Order for this operation: Chooses the first eligible picture source in document order from supplied media-match and format-support flags. Supply only source elements before the fallback img that have usable source sets. Reports selected element presence without fetching or selecting image candidates.

Further background: HTML / accessibility reference: Viewport Meta width=device-width Check.

References

HTML / accessibility reference: Viewport Meta width=device-width Check — drafts.csswg.org
Viewport Meta width=device-width Check — tool.io

Similar or alternative tools

sizes Attribute Width Formula Lookup
Resolves the first matching sizes clause from parsed media flags and already-resolved nonnegative CSS pixel lengths. If none matches, source size defaults to viewport width (100vw). Auto sizes and CSS parsing are outside this profile.
picture/source Art Direction Order
Chooses the first eligible picture source in document order from supplied media-match and format-support flags. Supply only source elements before the fallback img that have usable source sets. Reports selected element presence without fetching or selecting image candidates.