Iyapo Joseph• 20
@iyapojoseph
Submitted
i found placing the card in the center difficult? i am open to correction or new ideas? im unsure of the body part and the classes? is there any way i wan make the code more accessible and easy to understand?
Samuele
@frasconi00
All comments
- Samuele• 170
@frasconi00
Posted
Hi, that's a great solution!
Welcome to the frontend mentor community.
I gave a look at your code and I have some ideas:
you could just use the main tag without having to add another div tag inside: img, h1 and p tags would be enough;
it is semantically better not to use h2 tags if there are not any h1 tags;
as for centering, a good idea is to style the body with display: flex; flex-direction:column; justify-content:space-around; align-items:center;min-height:100vh.
Hope you find this helpful, these are just some tips from my little experience but you really did a great job! Happy coding 😊
Marked as helpful
0 - Colten Siemer• 200
@Coltensiemer
Submitted
Second Attempted. Fixed image on small screens and media query!
What is a great why to test different view sizes? Do people normally use a browser extension? Website? Please share so I can learn!
Samuele• 170@frasconi00
Posted
Hi Colten, welcome to the front-end mentor community!
I really like your solution, you did a good job.
I just wanted to tell you my way to test different view sizes: I use the developer tools of my browser (which is Google Chrome). The keyboard shortcut for it is CTRL + SHIFT + i.
You can resize the screen as you like, and you can also test what your page looks like on some mobile phones or iPads and so on.
Hope this was helpful! Keep it going and bye for now😊
0 - João Oliveira• 370
@jvmdo
Submitted
Is it right to set padding, margin, gap using rem instead of px?
Samuele• 170@frasconi00
Posted
Hi, welcome to the Frontend Mentor community! That's a great solution.
To answer your question: yes, it is always a good idea to use relative units rather than absolute ones. Using rem, vw, vh, percentages and so on is highly recommended as I've come to see in my little experience.
The code looks pretty clean, one thing I would say is that you don't need the section tag: img, h1 and p tags are enough for this project.
The rest looks great, can't wait to see other solutions to the challenges. Happy coding! 😊
Marked as helpful
1
