Skip to content
Submitted over 2 years ago

order-summary-component using flexbox

accessibility
LuckyPort•100
@LuckyPort
A solution to the Order summary component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Every comment and suggestion means a lot to me. thank you <3

Code
Couldn’t fetch repository

Please log in to post a comment

Log in

Community feedback

  • Vanza Setia•27,715
    @vanzasetia

    Hi, LuckyPort!

    You should not have visually hidden headings like this.

    <h2 class="sr-only">Annual Plan</h2>
<h3 class="sr-only">Annual Plan</h3>

    They are not needed. Make the visible text <h2> instead.

    Also, for the visually hidden styling, I recommend using the one from The A11Y Project website.

    See visually hidden styling — How-to: Hide content - The A11Y Project

    Learn more about visually hidden styling — The anatomy of visually-hidden - TPGi

    I hope this little suggestion helps you!

    Marked as helpful

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