Submitted about 3 years ago
First Challenge Order Summary Component using CSS flexbox
@joseale17
Design comparison
SolutionDesign
Solution retrospective
This is my first challenge in fronendmentor, any feedback is well well received.
Community feedback
- @kens-visualsPosted about 3 years ago
Hey @joseale17 👋🏻
I have some suggestion to help you fix the accessibility issues and some other things.
- In your markup,
<div class="containner">...</div>
should be<main class="containner">...</main>
and<div class="attribution">...</div>
should be<footer class="attribution">...</footer>
. These will fix the accessibility issues. Don't forget to generate a new repot once you fix the issues. - For the music icon, add
aria-hidden="true”
, because it's for decoration. You can read more aboutaria-hidden
here. - Hero image should have a
display: block;
, it removes the line underneath the image. If you want to know what's causing it, check out the 3rd section of this video - Also, I suggest implementing the
:hover
state, images of which you can find in design folder >active-state
. - Next, I suggest using
<h2>
or<p>
instead of<h4>
, because headings in HTML have to increase gradually, such ash1, h2, h3….
I hope this was helpful 👨🏻💻 overall, for the first project you did a great job, I'm glad you could fix the link. Cheers 👾
Marked as helpful1@joseale17Posted about 3 years ago@kens-visuals wooow thanks for the feedback, i will fix the code according to your indications, thank you very much.
0 - In your markup,
- @joseale17Posted about 3 years ago
I already made the suggested changes. How can I edit the challenge link?
or do I have to upload a new solution to the challenge?
0
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