CODEWITHSUNDEEP
htmlcsssass
pratteek shaurya
pratteek shaurya

Reputation: 960

sass gets compiled but does not run in my browser

this is my html code:

<!DOCTYPE html>
<html>
<head>
    <title>nested</title>
    <link rel = "stylesheet" type = "text/css" href = "style.scss">
</head>
<body>
    <div class = "class1">
         <h1>Heading</h1>
         <p id="p1">Paragraph 1</p>
         <p id="p2">Paragraph 2</p>
         <div class = "class2">
            <h1>Heading</h1>
            <p>Paragraph</p>
         </div>
      </div>
</body>
</html>

this is my style.scss:

.class1{
   h1{
      font-size: 25px;
      color:#E45456;
   }

   #p1{
      font-size: 25px;
      color:#3C7949;
   }
   #p2{
      font-size: 25px;
      color:#3C7949;
   }

   .class2{
      h1{
         font-size: 25px;
         color:#E45456;
      }

      p{
         font-size: 45px;
         color:#3C7949;
      }
   }
}

My style.scss gets compiled in the command prompt and a new style.css is also generated. But on web browser my page does not have any of the styles which I gave to it.

Upvotes: 0

Views: 1686

Answers (1)

Deepak Yadav
Deepak Yadav

Reputation: 7079

Because, you need to give reference of your CSS file not the SCSS file. The browser cannot render a SCSS file for styling.

Check your html code, you referenced wrong file. enter image description here

Upvotes: 6

Related Questions