Lukas Petrikas
Lukas Petrikas

Reputation: 85

Using external .css for html styling

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

Answers (1)

rubenpoppe
rubenpoppe

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

Related Questions