CODEWITHSUNDEEP
htmlcssvisual-studio-code
Golden Sun
Golden Sun

Reputation: 63

SCSS file does not work on index.html live server

For some reason, my SCSS code does not work on my html file live server. I simply input background color to red but it does not show the correct color on live server. The script in html file for linking css file should be correct.. The post does not allow me to put too much code. Please let me know if I need to provide more code.

Someone please help!

Thanks!

Here is my html code:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>The 2021 Frontend Developer Crash Course</title>
    <link rel="stylesheet" href="css/main.css"/>

Here is my scss file code:

@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,700;1,700&display=swap");
ody {
  background: #d81c1c;
  margin: 0;
  font-family: "Poppins";
}

.navbar {
  background: rgb(173, 25, 25);
}

Upvotes: 1

Views: 608

Answers (1)

James Drinkwater
James Drinkwater

Reputation: 406

So, you have a few issues here.

Firstly, as Akshay pointed out, your first tag in the css file is 'ody'. I'm assuming this should be 'body'.

Secondly, when setting a colour to the background you should use background-color rather than background. The background css is for assigning an image.

Finally, you havent mentioned, but scss needs to be compiled down to css. I'm assuming this scss file is main.scss and you're compiling down to main.css using visual studio?

To make sure your css is right, I would use the developer tools in Chrome. press F12 in chrome, select the correct element and then under 'Styles' add the css you're looking to use. It lets you che

Upvotes: 1

Related Questions