Search⌘ K
AI Features

Sizing Backgrounds Using Keywords

Explore how to size background images in CSS using the keywords contain and cover. Learn their effects on image display and responsiveness while maintaining aspect ratio for better design flexibility.

In one of the first examples in this section, we used a large background image within a smaller element.

The result was that the image got cut off. What if we didn’t want this behavior​?

Here’s the example again.

This time we’ll size the background image using these keywords. Like this:

 ...