From the course: CSS: Images

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Fitting an image inside any container

Fitting an image inside any container

From the course: CSS: Images

Start my 1-month free trial Buy for my team

Fitting an image inside any container

“

- Illustrator] Working with images, you often need to get an image to fit inside the proportions of a containing elements. And that containing element may not have the same proportions as the image. This is a bit of a challenge because if you change the proportions of an image it starts looking weird right away. In this example, I've created a container, it's outlined here using a pink border and then I have an image inside that container. And right now the image is bigger than the container so it's spilling out of the bottom of the container. I need to contain this image inside its containers with displays properly. To experiment, the first thing I'd do is probably try to set both width and height to 100%. This would make the image fit inside the container perfectly but I'm also changing the proportions of the image so it's squished vertically in this case and it looks weird. If this is a picture of a person you…

Contents