Use CSS to solve common problems

Shadows can be added to boxes with the box-shadow property. This tutorial explains how it works and shows an example.

The object-fit property provides different ways to fit an image into a box which has a different aspect ratio, and you can find out how to use them in this tutorial.

A rundown of the different properties that might be useful when styling boxes using CSS.

The opacity property and color values with an alpha channel can be used for this; find out which one to use when.

Shadows can be added to text with the text-shadow property. This tutorial explains how it works and shows an example.

Find out how to target the first line of text in a paragraph with the ::first-line pseudo-element.

Find out how to target the first paragraph with the :first-child pseudo-class.

Combinators can help you to precisely target elements based on where they are in the document; this tutorial explains how to use them to apply CSS to a paragraph only if it immediately follows a heading.

Centering an item inside another box horizontally and vertically used to be tricky, however flexbox now makes it simple.