Reputation: 85
I have an issue that I cannot link my external style.css to my index.html file. Both files are in exact same directory.
My style.css :
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
text-align: left;
}
</style>
And I am trying to link it in my html as following:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>test</title>
<link href="style.css" type="text/css" rel="stylesheet"/>
</head>
Full html script:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>test</title>
<link href="style.css" type="text/css" rel="stylesheet"/>
</head>
<br>
<table id="t1">
<caption>Operation table</caption>
<thead>
<tr>
<th>Operation code</th>
<th>To Do</th>
<th>Done</th>
<th>Left</th>
</tr>
</thead>
<tbody>
<tr>
<td>abc</td>
<td>1000</td>
<td>50</td>
<td>
</td>
</tr>
<tr>
<td>def</td>
<td>555</td>
<td>50</td>
<td id ="number1">
</td>
</tr>
</tbody>
</table>
<p id="demo"></p>
</html>
All the examples that I have looked up online use exact same method.
I have connected to the webserver and turned on developer mode to see if I can see anything. I have managed to spot an error:
Refused to apply style from '192.168.10.173:8080/style.css' because its MIME type ('text/html') is not supported stylesheet MIME type, and strict MIME checking is enabled
Still looking into why it could be caused
Upvotes: 0
Views: 380
Reputation: 316
CSS files shouldn't have style
tags. Simply remove them and it'll work.
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
text-align: left;
}
When you want to declare styles inside of an HTML file, then you have to put the CSS between style
tags.
Upvotes: 2