CSS not loading correctly when deployed in /public

support
1

Hi here’s another “my css isn’t working!!” post but i assure you it’s different this time. I’ve tried all different things for baseURL (“”, “/”, “https://andrewjm.me”) and nothing worked, so i investigated in inspect element and the browser is properly receiving the stylesheets that are linked in index.html, but it’s not applying or “running” them. I know this because when i edit one inside of inspect element, it applies it but it just refuses to apply the css on the initial load of the page. what’s more, one sheet (vncnt.css) @imports another (barebones.css, not linked on index.html) but the browser never even requests barebones.css from the server. This is not a browser issue as i have tried it on 4 different browsers.

see for yourself at https://andrewjm.me

Thanks in advance.

2

See what your browser’s developer tools tell you about your style sheets. My best bet is that your server is set up so that it delivers .css as text/html.

This is not a Hugo issue, the CSS is there. But your browser refuses to load it because the MIME type it is delivered with does not match the one needed for style sheets.

3

As @chrillek says, the css is being delivered with a mime type of html, not css. I’d take Cloudflare out of the loop for starters, as I imagine it’s a misconfiguration there. I wouldn’t bother putting a site behind Cloudflare while in development, it’s ony going to add complication.

4

This was the answer. Thank you so much :slight_smile: