Help:TemplateStyles/examples

Responsive templates
Another good use case is making templates responsive. "Responsive", in this case, means that elements dynamically grow, shrink, move around or become hidden depending on a device's features, such as height or width. Template:ResponsiveAmbox is a modified version of Template:Ambox that uses Template:ResponsiveAmbox/styles.css. The styles will hide the image to the left if the browser window is narrow enough. Here's an example:

Just like with the previous example, this cannot be done using inline styles.