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 built with html css and vanilla js

Kerri-Ann 330

@Kerri-AnnBates

Desktop design screenshot for the Launch countdown timer coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Had some trouble with getting the nooks built into the cards to match the design. If anyone knows of any resources that I can take a look at to add that unique look to the card, that would be awesome!

Community feedback

@MojtabaMosavi

Posted

Regarding you query, there are two most obivious way of implementing them:

1 All html elments have pseudo elements but there are two of them that you mostly use for cosmatic purposes. Using the the ::after and ::before you can implement them, take a look at my solution to see how i did it. My solution: https://www.frontendmentor.io/solutions/launchcountdowntimermain-RFKBZhKW9

2- You can also do it with two span and the style would be approcimately the same as the implementation 1.

Keep coding :=)

Marked as helpful

1

Kerri-Ann 330

@Kerri-AnnBates

Posted

@MojtabaMosavi Fantastic! Thank you for sharing, I'll take a look and see how I can implement this to what I have so far.

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