@Alex-Archer-I
Posted
Hi! Good work =) Cool idea with hover and the box-shadow.
You don't have to declare height for img - you can just use width and it'll keep it's proportions. Also you can use percentages to make it responsive.
Yeah, flex is much easier than a grid. Just set display of parent element to flex and use align-items and justify-content (not 'justify-items' like in grid) to arrange content.
.flex {
display: flex;
flex-direction: column; /* row is default value */
align-items: center;
justify-content: center;
}
And hey - I learned how to use backticks =)
Marked as helpful
@LoneBrokeBoy
Posted
@Alex-Archer-I Nice. Your reply looks more professional now. :)
Removing height for the article-img inside media query fixed the issue with border-radius.
I see. I can heard using percentage for elements is bad practice but I guess its good practice to use it for images. Also, thanks for teaching me how to use flex. Your feedback is great as always.
@Alex-Archer-I
Posted
@LoneBrokeBoy Thank you =)
I usually use percentage for creating responsive elements like this:
main {
width: 95%;
max-width: 40rem;
}
When display size is less than 40 rem this element always will be 95% from it. And for images I meant using width: 100% for those that should stretch with the element - like header picture - and using px or rem for static pictures - like user profile.
But I'll read more about pros and cons of percentages.
So, thanks again. Fell free to ask, comment and stuff =)
