Why css is sometimes ignored?

support
1

Hello! I’m super new at Hugo, I’m reading the full documentation and I’m trying to get better in time.

Sometimes on the website I’m building, the entire page appears unformatted like the css isn’t loading. I’m using latest Hugo version with the Notepadium theme.

So when I load a page, for instance this one, it all renders beautifully. But if I go into the top right nav menu, and click on “eventi” again (it points to the same exact address), the page is rendered like in the screenshot.

Schermata 2020-01-16 alle 14.32.00
Schermata 2020-01-16 alle 14.32.001258×1522 145 KB

Also note that this is served over http even though I have https hard enforced from my web host interface.

Does anyone have any idea why this is happening?

It all started when I created a .htaccess trying to make the 404.html work.

P.S. the url for the website is fabiorusso.net/rethinkecopi

2

Hi Gatto, welcome to the forum! :wave:

I can’t replicate your issue, both the CSS one as the http one. It it perhaps a browser issue?

Here’s a video of what I see with Firefox: https://recordit.co/s114F4LdN7

1 Like
3

Hey @Jura, first of all thanks for testing this out and for the video. I’m happy that this works for you, It might be a browser issue though, because the following happens for safari iOS and safari Mac:

https://share.icloud.com/photos/0ENTdeBmW8vDjj-DtFVCaj80Q

I’m at a loss here as to what is the problem exactly :confused:

4

In the video, the page where the CSS isn’t loaded is not loaded over https (i.e. safari says ‘this page is not secure’).

Something is wrong with the link, such that it points to http rather than https or you need to fix the redirection on your site so all requests are served over https.

5

Unfortunately this is not it. All requests from my web host are already served with TLS and all links are https already. :confused:

6

Hmm, what an odd and confusing problem to have! :confused:

I don’t know why the website fails with Safari mobile, but two things worth testing:

  • Does the problem also happen when the CSS file doesn’t have a SHA integrity tag?
  • Does the issue also occur when the CSS file is referenced in a <head> element?
1 Like
7

It’s super odd and confusing. After delving into access logs I’m now convinced I broke something about TLS with the htaccess file that should not have been affected at all that way.

Just to be complete, I did create the following .htaccess
RewriteEngine off
RewriteEngine on
it started the problem, but the problem persisted even after I deleted this file.

I don’t know how to do the second one, but about the integrity tag, I tried removing it and it works fine now. So it’s very likely that was the problem.

What could make Safari fail the integrity check? Also, is there a command or a parameter passed to Hugo to make it skip the integrity tags during build?

8

Normally no, but your theme can look up a variable that’s defined in different configuration files. (You might use one configuration file for local builds, and one for the deploy.)

9

I think what you suggest is slightly too advanced for me, but the problem has solved itself from me deleting my user and recreating it on my web host. I regret having to apply such a brute solution but you know, I’m not a professional myself so I have to use the tools I have :confused: