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

recipe-page --> solved

ritu jha 60

@ritujha19

Desktop design screenshot for the Recipe page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@mike15395

Posted

@ritujha19 Congratulations on completing challenge! You are very close the design.

Here are few changes which will bring you more close to solution:

  1. CSS for changing colors for lists (both ul and ol)
ul {
    list-style: none;
}

ol {
list-style: none;
counter-reset: my-counter;
}

ol li{
    counter-increment: my-counter;
}

ol li::before
{
    content: counter(my-counter) ". ";
    color: hsl(14, 45%, 36%);
    margin-right: 1%;
}
ul li::before{
    content: ".         ";
    font-size: 30px;
    margin-right: 1%;
    color: hsl(14, 45%, 36%);
}
  1. Try to make it responsive

Rest your code is awesome!

Happy Coding:)

Marked as helpful

1

ritu jha 60

@ritujha19

Posted

@mike15395 thanks , I will do this

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