2

I need help again. I'm watching some tutorials, and I have an easy code that works fine with internal CSS, but I doesn't with external CSS. I think I'm doing everything right, since I don't change a single word of the code, excep for the external css reference. Any ideas why is it not working? Thanks for your answers! (By the way, I read all the post relationed with my problem, but nothing work out.) Here's the code:

div.box
{
width:320px;
padding:10px;
border:10px solid green;
margin:0px;
font-family: Arial, Helvetica, Sans-Serif;
font-weight: bold;
font-size: large;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="new 1.css">
</head>
<body>
<div class="box">This text in a box example uses css.<br /><b>Note:</b> there is a
DOCTYPE declaration (above the html element), so it displays correctly in all browsers.
</div>
</body>
</html>

It work out here! It is driving me insane. I tried it in Notepepad++, Brackets, and text editors. I really can't figure out what's happening.

6
  • is the file name "new 1.css", there is a space check it once. Feb 14, 2015 at 14:57
  • 6
    There shouldn't be spaces in the URL, use href="new%201.css".
    – Guffa
    Feb 14, 2015 at 14:58
  • I forget to say that the files are in the same folder, and I tried too with subfolders.
    – Paul
    Feb 14, 2015 at 14:58
  • My best guess: spaces in URLs don't work in your web server or browser; the CSS is somewhere else; it loads properly but it has nothing to offer; perhaps it's somewhere the server wasn't configured to serve from? Feb 14, 2015 at 14:58
  • Guffa, that doesn't work, i'm gonna try change the name of both files without spaces to see what happens.
    – Paul
    Feb 14, 2015 at 15:01

5 Answers 5

4

You can't have spaces in a URL, try changing the space to its ASCII character: %20 so it would look like this:

<link rel="stylesheet" type="text/css" href="new%201.css">

Or what I would normally do is use proper file naming conventions, either camel case (every word [ besides the first one] starts with an upper case letter) or use underscores between the names.

4

I had the exact same problem a few days ago. (And I had no spaces in my file name..)

As soon as I outsourced my CSS code in an external file, the exact same problem came across.

For me the problem was in the encoding.

For those who have this problem too: Just switch the file encoding to UTF-8 . (I used Notepad++)

Maybe you have to add to your html file:

<meta charset="UTF-8">

And then it should finally work.

see more here: http://www.w3schools.com/html/html_charset.asp

2

Change encoding of the css file to utf-8 using simple notepad. Open css file by notepad, save as then choose utf-8 from encoding tab then save.

1
0

Remember to check that there is no inline style. So, an inline style has the highest priority, and will override external and internal styles and browser defaults.

0

I had this problem too. But I understood that my wrong is here: when I was writing HTML file, I changed the direction of this file to a folder and created a CSS file next to it. So my path for CSS file became wrong. Now I recommend to first close your editor of HTML or CSS, after choosing your direction of these files, then open your editor and write your code.

Not the answer you're looking for? Browse other questions tagged or ask your own question.