Responsive Single Price Grid Component using Virtual Studio Code

Hello @Lovethrech,

Congratulations on completing the challenge!

This challenge specifies a font-family of Karla and a font-weight of 400 and 700. The code to import the font to your css with these parameters is:

@import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;700&display=swap');

To answer your other question, you can use text-decoration to remove the underline from any text or links:

a {
  text-decoration: none;
}

Happy Coding!

Hello, if you want to import the font’s there are two ways you can achieve this. The simplest way is to link the font directly into your index.html document (directly in the head). I saw that you added the Import rule into your CSS file, but it goes into the head of your html. You would use the following in the head.

<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=Karla:wght@400;700&display=swap" rel="stylesheet">

In your css file you would use the following to choose the Karla font.

{ font-family: 'Karla', sans-serif; }

The next way you achieve this is to use the relative feature. For example, you would download the fonts from google and use the following rule: you would have to add the specific fonts to one of your relative files.

@font-face {

font-family: Karla;

src: url(Fonts/Karla-Regular.ttf);

}

@font-face {

font-family: Karla-Bold;

src: url(Fonts/Karla-Bold.ttf);