Submitted 6 months ago

Recipe page

George Krause•90

@georgekrause

Preview site View code

This is a solution for...Recipe page

HTML
CSS

1newbie

Design comparison

SolutionDesign

Solution retrospective

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

I'm getting more comfortable with html elements like table, article, ol, and ul. Still learning different sudo elements with in css to make it easier to style the page.

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

It was a challenge getting just the bottom line with in the table element instead of a box around the whole table like it normally is. Stack overflow was a great resource for solving that issue.

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

Is there an resource for different page layout instead of writing it out from scratch?

Community feedback

María López•240

@oppaheroPosted 6 months ago

Hey!

The link to the site here in the solution seems to not be working, but the one in your repository is fine

To load the letters that you will use on your page you can use @font-face if you have the fonts

@font-face {
  font-family: "Young-serif";
  src: url("../assets/fonts/young-serif/YoungSerif-Regular.ttf");
  font-weight: 400;
}

Or include those from google fonts

Embed code in the <head> of your html

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Young+Serif&display=swap" rel="stylesheet">

Happy coding!

Marked as helpful

Please log in to post a comment

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