Skip to main content

HTML Guide

Bad value X for attribute “sizes” on element “img”: Expected units (one of “em”, “ex”, “ch”, “rem”, “cap”, “ic”, “vw”, “svw”, “lvw”, “dvw”, “vh”, “svh”, “lvh”, “dvh”, “vi”, “svi”, “lvi”, “dvi”, “vb”, “svb”, “lvb”, “dvb”, “vmin”, “svmin”, “lvmin”, “dvmin”, “vmax”, “svmax”, “lvmax”, “dvmax”, “cm”, “mm”, “q”, “in”, “pc”, “pt”, “px”) but found “w” at Y

The sizes attribute on the img element must use CSS length units (such as px, vw, em) and not image width descriptors like w.

The sizes attribute defines the intended display size of the image in CSS length units, which helps the browser select the appropriate image from the srcset. Use units like px (pixels) or vw (viewport width percentage), not w, which is used in the srcset descriptors. The srcset attribute specifies different image resources and their width descriptors (e.g., 860w), while sizes reflects the image’s display size in the layout.

Correct usage:

  • sizes="(min-width: 568px) 140px" tells the browser the image will be displayed as 140 pixels wide when the viewport is at least 568 pixels wide.
  • srcset="photo.png?w=860&q=90 860w" uses w as the descriptor for the image resource’s width.

HTML example:

<img
  alt=""
  sizes="(min-width: 568px) 140px"
  srcset="photo.png?w=860&amp;q=90 860w"
  src="photo.png?w=860&amp;q=90">

Summary:

  • Use CSS units like px, vw, etc. in the sizes attribute.
  • Use the w descriptor only in srcset, not in sizes.

Learn more:

Related W3C validator issues