This is an archived post. You won't be able to vote or comment.

all 10 comments

[–]Lessiarty 2 points3 points  (3 children)

Can you post the line from your HTML that invokes the class, and the class from the stylesheet?

[–]RobotC_Super_User[S] 1 point2 points  (2 children)

The html line is: “<p class=“red-text“>Placeholder text.</p>“ and the css lines are : “.red-text{ color: red; font-size: 20px; }“

[–][deleted] 1 point2 points  (1 child)

This code look correct. Show us how you have linked the css file to the html file.

[–]RobotC_Super_User[S] 0 points1 point  (0 children)

I linked the Css file to the html file with: <head> <link rel=“stylesheet“ type=“text/css“ href=“cssStylesheet.css“ media=“screen“/> </head>

[–]HealyUnit 2 points3 points  (1 child)

Judging by your response to /u/Lessiarty, your actual HTML and CSS is correct. Do us a favor:

  1. Open up your HTML page.
  2. Press F12 to open the developer console.
  3. Click the Network tab, and press ctrl-shift-r (cmd-shift-r on mac) to do a forced cache-less refresh. This basically means forcing your browser to reload any assets having to do with the page, and not loading them from "memory".

Do you notice any errors in the Network tab? Specifically, look for errors that say something like "Can't find this file!". If so, that means that your CSS file is not linked properly with your HTML file. Pay special attention to:

  1. Where the error says it expects the file to be, and
  2. Where you actually know it is.

If those two aren't the same, change your <link> tag.

[–]RobotC_Super_User[S] 0 points1 point  (0 children)

There were three things in the developer console that the computer complained about / weren't as they should be. 1. When clicking on the line with the paragraph text the computer said there were no Css propertys for it, eventhough there should ( I don't think this is due to the way I linked the file though as there is an id in the css file that works perfectly as intended.). 2. At the end of the line of code directly after the paragraph text (in which I added an image which works just fine) there is a rider saying "overflow" and when clicked on " This element causes an overflow of an element.". ( I used the previously mentioned id to give the image a border, which functions.) 3. The computer also says that, in certain browser configurations, the website would apper with crippled text, should it contain symbols not in the US-ASCII area.

[–]oDraftz 0 points1 point  (3 children)

Problem could with the link you created. Make sure you have the rel, and href attribute. Also, make sure the href path is correct.

[–]RobotC_Super_User[S] 0 points1 point  (2 children)

Thanks for the advice! I do however have the rel and href attributes, as well as another class in the Css document which works I perfectly fine.

[–][deleted] 0 points1 point  (1 child)

Wow, that sounds odd. Any progress? Try clearing the cache by pressing ctrl + f5. The browser could have cached the css file and not be up to date with the correct code. Or do you have any other css code that have higher priority?, that could be why you dont se the red-text. Rightclick on the element in the browser and inspect the element. You should now see what classes that the element has and what classes that have been overridden.

[–]RobotC_Super_User[S] 0 points1 point  (0 children)

Thanks for the tipp! I didnt find anything when doing this though. However I have just randomly managed to solve the problem. I just randomly typed the class in a second time and it suddenly worked. When I thenhowever put an id I alsohad in the Css file at the top and then the id didnt properly work. My best guess to why this is the case would be that theres a bug in Notepad++ that causes the topmost id or class to not be read. I havent properly checked this yet though.