Design comparison
Solution retrospective
Colocar a imagem no tamanho responsivo.
Community feedback
- @correlucasPosted about 2 years ago
๐พHello Jorge, Congratulations on completing this challenge!
Your component is perfect, but is not responsive yet, this is due the
fixed width
you've applied to the container.Look both
width
andmax-width
the main difference between these properties is that the first(width) is fixed and the second(max-width) isflexible
, for example, a component withwidth: 320px
will not grow or shrink because the size will be ever the same, but a container withmax-width: 320px
ormin-width: 320px
can grow or contract depending of the property you've set for the container. So if you want a responsive block element, never usewidth
choose ormin-width
ormax-width
.Note that there's no need to use
height
here, because since you set aheight
for an element, this means that this element will grow until a certain point and after that the inner content (as texts or images) will start to pop out the element due its fixed height, so isn't necessary to set theheight
the container height comes from the elements, its paddings and height.โ๏ธ I hope this helps you and happy coding!
Marked as helpful0@jorgealves-bPosted about 2 years ago@correlucas thanks for all, i'm just begginer !
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord