Why does my HTML not link with my CSS?

Question

I am working on my website, and my HTML isn't linking to my CSS. Can somebody please shed some light on this issue?

This is the snippet from my code.

<link href="css/style2.css" rel="stylesheet" type="text/css">

My file directory goes like this.

• /root
  • /css
    • style.css
    • style2.css
  • /html
    • index.html
    • webconfig.html
  • /Images

Is this correct?

Answer 1

Use relative URL <link href="../css/style2.css" rel="stylesheet" type="text/css">

The url css/style2.css should be relative to the HTML file(the file that contains code <link href="css/style2.css" rel="stylesheet" type="text/css">) .

.. in above relative URL indicates go one folder back, and then to the css folder - and in that css folder use style2.css file.

Similarly ../../ , means go two folders back and so on.

Answer 2

Your current href is a relative path, rooted from where ever the HTML file is.

You can either use a correct, relative path...

<link href="../css/style2.css" rel="stylesheet" type="text/css">

Or you can use an absolute (domain-rooted) path...

<link href="/css/style2.css" rel="stylesheet" type="text/css">

... assuming your website is deployed at the root of your domain.

Answer 3

The link you have is relative, so it starts looking in the same folder as your html. You could do an absolute path to the css with /css/style2.css or use a relative path ../css/style2.css