Sublime Forum

Linking main.css won't show background color on my website

#1

Hi i’m a new web developer and new to sublime forum. I am currently working on a practice site in Sublime. Though the issue i’m running into is that trying to implement color into my site is ineffective. I’ve checked the code multiple times for coding errors and do exactly as the tutorials state, however i might have missed something along the way. I double checked to make sure lines of code were closed and everything. I don’t want to have to start from scratch but it may be necessary. anyway guys thanks and if I could get some input, that would be amazing! Have a great day guys!

Site Page Issue Example: quick note, this is not the exact perfect code just using to show you where the issue may possibly lie.

head>
title>League of Legends Example Page
link href=“styles/main.css” rel=“stylesheet” type=“text/css”/>
/head>

Currently Whats in Main Dot CSS:
body {
background-color: red;
}

0 Likes
#2

Hello, welcome to the forum!

As a first note, when you post code in the forum you should mark it up by including a row of three back ticks on the lines above it and below it, so that the forum knows that you meant it to be code and it doesn’t try to interpret it.

That makes the code easier for everyone to read, which makes it easier for people to help you. For example, a simple blank web page might look like this while you’re editing it (note the top and bottom lines are the back ticks):

```
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>

</body>
</html>
```

With that out of the way, based on what you’ve shown in your question the only reason I can think of for it not working (where not working means the background color didn’t change) is because it can’t find the CSS file.

The page code tells the browser to look for a file named main.css in a folder named styles that is inside of the same location that your HTML file is stored. That is to say, the folder structure should look like this:

|-- styles
|   `-- main.css
`-- test.html

I would double check that you have put the CSS file inside a folder with that name, or alternatively edit the <link> tag to say href="main.css" instead, which will make it look for the main.css file in the same place as the HTML is coming from.

When in doubt, use the developer tools in your browser to choice and check to see if it’s giving you any errors while it loads the page, such as a failed load request because it can’t find the CSS file.

1 Like
#3

Thank you a bunch , it solved my issue!

0 Likes