Skip to content
Submitted 9 months ago

Recipe Page

Raquel Fonseca•30
@RaquelDFS
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Recipe page
  • HTML
  • CSS
1newbie

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•220
    @nicholasboycePosted 9 months ago

    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

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