Val Val
Val Val

Reputation: 11

CSS error: at-rule or selector expected, { expected

I'm trying to run this code on Visual Studio Code and faced these errors:

at-rule or selector expected at Ln1 Col1, Ln7 Col 1, Ln50 Col1

{ expected at Ln2 Col1, Ln51 Col 1

I tried to run these on W3Schools and they ran just fine. How can I solve this issue? Here's the code, thank you!

<!DOCTYPE html>
<html>
<head>
<style>
body {
    background-color: white;
}

/* Text Display */

h1 {
    font-family: georgia, "Times New Roman", Times, serif;
    color: black; /* Set text color to black */
    text-align: center;
}

#p1 {
    font-family: Arial, Helvetica, sans-serif;
    color: blue; /* Set text color to blue */
    text-align: center;  
}

.center {
    font-family: Arial, Helvetica, sans-serif;
    color: green; /* Set text color to green */
    text-align: center;
}

/* unvisited link */
a:link {
    color: blueviolet;
  }
  
  /* visited link */
  a:visited {
    color: gray;
  }
  
  /* mouse over link */
  a:hover {
    color: blue;
    font-weight: bold;
  }
  
  /* selected link */
  a:active {
    color: blue;
  }

</style>
</head>
<body>

<h1>Welcome!</h1>
<h2 id="p1">Enjoy numerous movie reviews and recommendations here.</h2>
<h3 class="center">Featured movie of the week:</h3>
<p><b><a href="default.asp" target="_blank">Everything Everywhere All at Once</a></b></p>


</body>
</html>

Upvotes: 1

Views: 17411

Answers (2)

Dickens A S
Dickens A S

Reputation: 4054

Sometimes your editor could have extra characters accidently placed somewhere

To see those you can refer this whitespace

Otherwise copy your entire code a normal notepad in windows and paste it back to VS Code

Or you can use Notepad++ and see all characters and then delete them

Otherwise copy paste you code piece by piece one style at a time, you can narrow the issue

Upvotes: 0

Ami
Ami

Reputation: 11

In Visual Studio Code bottom right, change Language Mode to HTML from CSS.

Upvotes: 1

Related Questions