-1

CSS is perfectly loading on the offline webpage (localhost) but on the live website, CSS is not loading.

I am using hosting and domain from the biz.nf website. I used bootstrap 4 on this website.

My index.html head code:

   <!DOCTYPE html>
   <html>
   <head>

    <title> </title>
    <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
     <link rel="stylesheet" type="text/css" href="http://www.site.c1.biz/css/style.css" media="screen" />
     <link href="https://fonts.googleapis.com/css?family=Poppins&display=swap" rel="stylesheet">
   </head>
ChrisF
  • 134,786
  • 31
  • 255
  • 325
Reevan
  • 1
  • 5
  • Are you using adblockers or privacy protectors in your browser? Whitelisted 'localhost' by any change? It may be possible that your browser blocks access to CDN and such. Happens to me once in a while... – Rene van der Lende Feb 20 '20 at 14:19
  • Load the page from the server, then click on the window and hit [Ctrl]-A (select all) and you will see that the page loaded and is showing text. Probably both text-color and body background-color are white, hense invisible text.... Not showing images because ../images/ content has error 403 -> 'not found'. Modify `` to `` to see what's going on – Rene van der Lende Feb 20 '20 at 14:29
  • Here's another trick I always use when developing a webpage: last line in your `` (or some other hideous color) and ``. Remove when done developing. Any other value than '1' in `` will (temporarily) remove the outlines.... If anything, this will at least show the outlines of your elements. – Rene van der Lende Feb 20 '20 at 14:42
  • Final option: Load your page, open browser developer tools, select '' in the inspector and modify body { background-color: black } in the properties tab. Tada, a black page with white text nicely animating .... – Rene van der Lende Feb 20 '20 at 14:50
  • Yes sir, when I select all by pressing 'ctrl+a' selected text appers. wait few minutes now I am checking whats wrong with pictures. Sir why its not loading background images (provided in images folder) – Reevan Feb 20 '20 at 15:00
  • Sorry Reevan, this is not a discussion/debugging board. One question per post only. Otherwise you can keep on modifying your code and run into new bugs and create an endless chat. That's not what SO is for... – Rene van der Lende Feb 20 '20 at 15:17
  • Now your images broken – vadivel a Feb 20 '20 at 15:44

3 Answers3

1

I saw your website in the inspect mode its showing style.css is 403 forbidden in the network tab

Check with it

you can check here ERROR 403 in loading resources like CSS and JS in my index.php

manoj
  • 297
  • 2
  • 11
  • Thanks Sir, but your provided guide is for Linux am using windows, Sir how to fix it, I have no idea because It's my 1st webpage, I tried many fixes from google but nothing helped. – Reevan Feb 20 '20 at 13:28
  • This question must get asked 10 times a day on SO and 1000 times a day all over the internet and the answer is always the same or similar to this one. – Rob Feb 20 '20 at 15:47
0

Maybe you try using relative css path or check your webserver configuration, because loading the CSS file returned a 403 forbidden error code.

mahpgnaohhnim
  • 63
  • 1
  • 8
0

Finnaly I figured it out, The problem was caused because my images was not in the same directory as of index.html

I tried many things.

Webpage inspect was throwing some error like - anime.min.js error in front of img name which was completely useless. Many said it as a broken img but it's a different issue.

Reevan
  • 1
  • 5
  • As I said in my other comment, 999 times out of 1000, the problem is this or something very similar. And the same solution is all over SO and the internet. – Rob Feb 20 '20 at 19:07