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

HTML & CSS USING GRID & JS

Harold 628

@harika09

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


Feedback will really help me improve

Community feedback

Arturo Simon 1,785

@artimys

Posted

Nice work Harold 👍 the site responds well. I have a few suggestions.

Design feeback

  • The "Try it Free" and "Get Started For Free" button could use hover styles
  • The 3 middle sections could be centered on desktop layout. Add a max-width and margin: 0 auto to center it

HTML feedback

  • Huddle logo - add a more descriptive alt text like "Huddle Logo"
  • For footer phone anchor tag, use tel: in the href tag. Example: <a href="tel:15431234567">+1-543-123-4567</a>
  • For footer email anchor tag, use mailto: in the href tag. Example: <a href="mailto:[email protected]">[email protected]</a>
  • Try the <input type="email"> for your input email address
  • I recommend making the footer social icons with anchor tags so it can utilize the tab key

Keep on coding!! 👍

0

Harold 628

@harika09

Posted

@artimys i added hover on the build community button and its not working. Trying all of your suggestions. Thank you!

0
Arturo Simon 1,785

@artimys

Posted

@harika09 I see what you mean on the community button.

Chrome dev tools tip:

In the Chrome browser (firefox as well), right click on the community button and click "Inspect". It should show you the anchor tag in dev tools but it actually shows your section.build-section which means that container is covering the anchor tag.

I see the ::before pseudo selector with a height: 100%, when I remove that then the hover works on the community button.

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