CSS Enhancing Design with CSS Styling Text Google Fonts

Lewis Cosmollis
seal-mask
.a{fill-rule:evenodd;}techdegree
Lewis Cosmollis
Front End Web Development Techdegree Student 3,291 Points

why isn't work sans showing up?

I've done what it asked I'll put my code here

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Lake Tahoe</title> <link rel="preconnect" href="https://fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,700;1,300&display=swap" rel="stylesheet"> <link rel="stylesheet" href="css/style.css"> </head> <body>

and the CSS

body{ font-family: 'Work Sans', sans-serif; color:#454959; font-weight:300; }

1 Answer

Hi Lewis!

This worked for me:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Lake Tahoe</title>
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,700;1,300&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <style>
     body {
       font-family: 'Work Sans', sans-serif;
       color:#454959;
       font-weight:300;
     }
    </style>
</head>
<body>
  Example Text
</body>
</html>

I didn't know if your body declaration was in the style.css file or not, if it is and not working then it is likely to be a file path problem.

In that case try these:

<link rel="stylesheet" href="/css/style.css">

Or

<link rel="stylesheet" href="./css/style.css">

Etc...

I hope that helps.

Stay safe and happy coding!