Problems loading stylesheets over https

Question

I recently applied an SSL certificate to my domain, but I had problems with some styles when viewing my website on http: // the styles are fine, but when viewing through https: // then the styles don’t apply, actually, I found out what the problem is: I didn’t download third-party styles through https, not http, switched to https, all problems were resolved.

Answer 1

You are probably using the http:// link for the stylesheet on the https:// website.

Protected websites are not allowed to mix protocols. Everything must be built in from a secure server. Browsers will ignore / block HTTP resources on HTTPS pages (with varying degrees of severity).

The reason for this blocking is that unreliable HTTP resources, such as style sheets and scripts, can still be modified by an attacker and are used to spoof / capture protected parts of the site.

If the stylesheet is filed from your server, omit the protocol + host part of the URL, i.e. instead of http://example.com/style.css use /style.css as the URL, so it will work on both HTTP and HTTPS. You can also use relative protocol urls .

If you must have one full URL, use only https://… URLs.

Answer 2

If the requested URI is https , if you have resources on the page (images, style sheets, JavaScript files, etc.) that are requested using the http scheme, some browsers may block them because they are considered unsafe, you can bypass this browser, but you also have alternatives in your code:

• Use https to request everything, or at least to match schemas.
• Use // to specify a schema. The browser will match the scheme with the request URI. For example: <link rel="stylesheet" type="text/css" href="//example.com/path/to.css">