Working Environment
- Operating System: Windows 8.1 64bit
- IDE: Visual Studio Code 1.15.1
Related Query
- HTML won't link to CSS file in Visual Studio Code
Problem Statement
HTML not Linking to CSS
- The classes and ids defined in CSS do not appear in Intellisense when writing HTML.
- When attempting to navigate from HTML to the respective CSS using F12, a message stating "the definition wasn't found." pops up.
However, viewing the HTML file in a browser displays the webpage correctly. This issue seems to be related to Visual Studio Code.
Sample HTML Code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Test</title>
<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>
<div class="abc"></div>
<div id="xyz"></div>
</body>
</html>
Sample CSS Code:
.abc{
width: 100px;
height: 100px;
background: red;
}
#xyz{
width: 100px;
height: 100px;
background: blue;
}
Directory Structure:
index.html
css
|
+---style.css
Webpage Display:
https://i.sstatic.net/STgG9.png
I am seeking assistance on resolving this problem effectively.
Edit 17/9/3 19:03
Thank you for your input. The following attempted solutions did not yield results.
href="../css/style.css"href="~/css/style.css"href="css/style.css"- Embedding stylesheet within the <style> tag (Note: I prefer keeping CSS in a separate file)