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
Desktop design screenshot for the Recipe page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


"I used the 'hr' tag in the table because I couldn't find another way to achieve the same result. Is this correct? Is it considered messy?"

Community feedback

@nicholasboyce

Posted

For that, I used this rule:

tr:not(:first-of-type) > * {
  border-block-start: 1px solid var(--line-color);
}

This means "everything within every table row except for the first one". You can't apply this styling on the table row itself, so this is your next best bet. When I practiced navigating through my page with a screen reader, I found this avoided having an extra element I needed to hide.

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