Website Design & Development

CSS Media Query

A CSS media query applies styling rules when certain conditions are met, such as a screen's width or a user's reduced-motion preference.

A CSS media query applies styling rules when certain conditions are met, such as a screen's width or a user's reduced-motion preference. Designers commonly use media queries to change a navigation layout or reposition service cards on smaller screens. A cleaning company's website might show a multi-column services grid on desktop and one column on a phone. Media queries support responsive design, but they are not the whole strategy: readable text, touch-friendly controls, appropriately sized images, and usable forms still require deliberate choices. The rules affect presentation rather than changing the underlying meaning of the content.