All solutions

What are you most proud of, and what would you do differently next time?

Custom Bullets with ::before

/* Custom bullets using ::before */
.preparation-time-list li::before,
.ingredients-list li::before {
  content: '•'; /* Unicode bullet character */
  color: var(--Nutmeg);
  position: absolute;
  left: 0.5rem;
  font-size: 1.5rem;
  line-height: 90%;
}

Explanation: Adds custom bullets to list items.

Highlighting the Last Child of Table Cells

.nutrition-table td:last-child {
  color: var(--Brandy-Red, #854632);
  font-weight: 700;
}

Explanation: Styles the last cell in each row of a nutrition table.

Next time I´ll go back to a simple reset for all(*). Tried only on body, but made things more difficult.

body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

Explanation: Resets margin and padding for the body element.

Recommended Reset for All Elements

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

Explanation: Resets margin and padding for all elements.

What challenges did you encounter, and how did you overcome them?

I think styling the lists and a table was a nice challenge and I learned something along the way of trying different solutions.

What specific areas of your project would you like help with?

Always open for suggestions. Maybe check out semantic and landmarks in HTML, but I think a "main" and "section" make sense.

What are you most proud of, and what would you do differently next time?

Just learned that for vertical alignment Grid is better than Flex, so I applied that to center the card.

What challenges did you encounter, and how did you overcome them?

Nothing special.

Used a VS code plugin to convert some px to rem and em. Quite nice to get used to conversions.

What specific areas of your project would you like help with?

Always open for suggestions!

What are you most proud of, and what would you do differently next time?

Trying to implement more best practices instead of coding "quick and dirty" html and css! I think I am making progress with that, feel free to comment!

What challenges did you encounter, and how did you overcome them?

Still learning about CSS Units and when to use which, but tried to use rem on text.

What specific areas of your project would you like help with?

CSS Units

What are you most proud of, and what would you do differently next time?

Happy to submit the challenge, filling out the all forms and the README.MD was the hardest part for now, haha;)

What challenges did you encounter, and how did you overcome them?

I am still a beginner at HTML and CSS, so I want to improve in these areas: Semantic Html // CSS Variables // Generally on professional workflows

What specific areas of your project would you like help with?

I am never sure which type of CSS Reset to use, but generally resetting margin and padding at the start helps me a lot.