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

Responsive landing page

@MouradBouzgma

Desktop design screenshot for the Huddle landing page with curved sections coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


everything was good until I wanted to set the background image I didn't know how to do it so I need your help if you know how to set the background image.

Community feedback

Hassia Issah 50,670

@Hassiai

Posted

Add aria-label attribute aria-label=" " to the <a> of the social media icons to fix the error and accessibility issue. The value of the aria-label is the description of the image. For more aria-label click here

For the first curved, give .stats a background-image with a background-size of contain and background-position: bottom -1rem for top curve and give .insight a background-image with a background-size of contain and a background-position of top -1rem for the down curve.

For the footer curve give .call-to-action the background-image curve for the footer, add background-size of contain and background-position bottom -1rem.

Hope am helpful.

Well done for completing this challenge. HAPPY CODING

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