@correlucas
Posted
👾Hello Jax Teller, congratulations for your solution!
I did this same challenge I know how hard it is, but you did everything fine.
About the cards, maybe you can manage it using display: flex; and justify-content: space-around; to manage the spaces. See the code fix below for your class:
.features__feature {
display: flex;
align-content: stretch;
flex-direction: column;
justify-content: space-around;
}
About the container, all I've done was that I create a .container with a max-width: 1110; and I've added it to each section to keep the main column consistent.
A better way to manage the hero image is using overflow: hidden; to get a better result when the screen scales down and the image get cropped without push the content.
If you want to see my challenge to take something as a reference, here's the link Jax: https://www.frontendmentor.io/challenges/skilled-elearning-landing-page-S1ObDrZ8q/hub/skilled-elearning-landing-page-vanilla-css-wr-dMF3Qk1
Hope it helps and keep it up, you're almost there with this challenge.
Marked as helpful
