@correlucas
Posted
👾Hi Felipe Mendes, congrats on completing this challenge!
Great solution and great start! By what I saw you’re on the right track. I’ve few suggestions to you that you can consider to add to your code:
The best to way to have this image and every image responsive and easy to work, its by creating a general property adding display: block
and max-width: 100%
to make it fits the size of the container the image is inside and also respect the container width while scaling, add alsoobject-fit: cover
to make the image auto-crop when resizing inside the column:
img {
display: block;
object-fit: cover;
max-width: 100%;
}
Think about using relative units as rem
or em
instead of px
to improve your performance by resizing fonts between different screens and devices.Anyhow, if we want a more accessible website, then we should use rem instead of px. REM does not just apply to font size, but to all sizes as well.
✌️ I hope this helps you and happy coding!
Marked as helpful
@Felipemendes097
Posted
@correlucas Obrigado pelo seu feedback , já anotei aqui tmj!