Design comparison
Solution retrospective
Any suggestion please 🙏.
Community feedback
- @tiagocostarebeloPosted almost 3 years ago
Hello, You are on the right path and it will only get better.
In your code, you need to close the <head> tag before starting the <body> tag. Also, assign classes to your HTML tags. You'll see how it helps your styling. Also, don't use <br> to create margin between HTML elements. Style them with margin-top or margin-bottom, depending on what you need. The same can be applied to the margins and how you set them in your paragraph. Check this link (https://www.w3schools.com/css/css_margin.asp)
There's also a the uppercase titles and the borders on the left and right that are rounded and the button, it doesn't take the full width.
And for accessibility issues to be removed, put everything inside a <main> tag.
Keep it up!
Marked as helpful0@manishasamantaPosted almost 3 years ago@tiagocostarebelo Thank you so much for your suggestion. I put everything inside <main> tag. and it worked. But can you explain what is the function of <main> tag ?
1@tiagocostarebeloPosted almost 3 years ago@manishasamanta this link is very useful to understand the main tag.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/main
0 - @whoiskekeanywayPosted almost 3 years ago
This is perfect, and You did an excellent job. You need to adjust the size of the fonts to match the design. Add border radius to the container also. Instead of being justified to the left, your button is also at the centre. so I think making the button small should solve this remove the tiny space between the cards
Marked as helpful0@manishasamantaPosted almost 3 years ago@whoiskekeanyway Thank you so much for your suggestion .
0
Please log in to post a comment
Log in with GitHub
Join 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