Design comparison
SolutionDesign
Community feedback
- @Aliyu-SaiduPosted almost 2 years ago
Hi Mohamed Firas Ben Othmen, Congratulations for successful completion of this challenge. Here are some tips which I feel will help you improve your code.
- your design doesn't look good on desktop (not been properly centralised both vertically and horizontally). This is because you did not specifically state the height of the section container (with a class of d-flex). Setting the flex property (align-items: center) when the flex direction is row, requires stating the height of the flex container to be more than the overall content height. Otherwise, the effect will not be felt. So you may consider setting the height of the flex container (here in this case section with a class of d-flex) to be 100vh. This should solve the problem.
- To increase the accessibility of your website, you may wish to visit the accessibility report links provided for you above. It is self explanatory. But for this challenge, you could just replace the 'section' element with 'main' element. Hope this help.
Please click the helpful button below if you find this feedback helpful. Thanks.
If you also wish to discuss this further, I am always available and more than happy to help.
Marked as helpful0
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