Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

intro-section-with-dropdown-navigation

Joe Sexton 250

@Joesexton9789

Desktop design screenshot for the Intro section with dropdown navigation coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I can't seem to get the big image to be the right size or get the text to line up properly as its shown in the design. Any advice on what I could have done wrong will be a tremendous help. Thanks.

Community feedback

T
Grace 29,310

@grace-snow

Posted

Hi

I’m afraid you are misusing aria-haspopup and aria-label here. The dropdowns should only have aria-expanded, no other aria attributes. It’s very important not to add aria-labels unnecessarily. These buttons already have a visible label. As soon as you change that label only for some users it will make the control inaccessible (eg voice control users could no longer say “click Features” as the label has been set differently)

These are not menus. That is a totally different role, specifically for sofware menus like the file menu on word or other software

Marked as helpful

0

@matiasluduena23

Posted

Hi Joe! Good work! Just three advice that might help you.

  • In your titles use the function clamp to set differents values to your font-size. >You can check this video.
  • For your image you can set a max-height: 750px.
  • In your main you can use `display: flex; justify-content: center; align-items: center;

Tried to avoid fixed sizes, and your website is going to be more dynamic hope this help you!

Good code!

Matias

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

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