CSS on a page secured with SSL (HTTPS) not applying properly.
Its working fine on Mozilla and internet explorer but not working fine on chrome.
I tried to call external css file using java-script based on protocol, but no success.
The problem is that when accessing your CSS file over HTTPS, you are redirected to the HTTP version, and so the browser will block the file as it is not served sercurely.
You need to make sure you do not redirect back to HTTP for static resources.
Go to your config file in the web directory and change
define('HTTP_SERVER', 'http://myweb.com'),
define('HTTP_CATALOG, 'http://myweb.com');
to: https://myweb.com
Related
I have worked IIS site which has worked in HTTPS. Something break and now when i try to get it in https site looks like that without CSS styles. I see in source and CSS and JS files try to open as http (which get 404 error when I try to open it), but when i try to open it via https everything work. How to "force" these to open these files via https? URL rewrite rule, but how?
Thanks for help
This what you experiencing is "mixed content blocking". It occures when you reach website via https but some elements are via http.
To resolve the problem you should configure http to https redirection.
You can find 'how to' here: https://www.ssl.com/how-to/redirect-http-to-https-with-windows-iis-10/
Also make sure that you don't hardcoded links to application elements via http in app code (if yes then change to https).
when I give reference of CSS on third party server using http://<link to CSS> it perfectly loads the CSS.
But When I give reference using //<link to CSS> the CSS doen't load.
Tested this in chrome and firefox.
Is there any specific reason behind CSS not working with //<link> ?
Why do you want to use protocol relative urls?
If your document is on http and you are loading js in https then it wont be any issue. And if the document is https and your trying to load http then it can cause problem. May be some browsers blocked content. If your js is available on https then always use https.
Also read this discussion
I have problem with tinymce 4.1.10. Icons are not shown in it, then i put it in page, that is loaded through https. Problem is that font files are loaded through http and browser writes in console:
Mixed Content: ... was loaded over HTTPS, but requested an insecure
font '...tinymce.woff'. This request has been blocked; the content
must be served over HTTPS.
Css file with reference to tinymce.woff tinymce/skins/lightgray/skin.min.css is loaded through https. It contains relative link to the font file.
I tried to test how it is loaded in tinymce site: https://www.tinymce.com/tryit/basic.php And it works here! Font file tinymce.woff is loaded though https. Files skin.min.css are identical in tinymce.com and in my server and both loaded by https, but why font file tinymce.woff is loaded through http on my site (and through https in tinymce site)?
What makes browser (i tested in FF and Chrome) to decide to use http or https?
PS. I read similar questions here and played with http headers, but it didn't help.
Finally i found solution. Problem was in .htaccess file in my server, that redirected some https calls to http. Thank you all, who read this and tried to answer :)
I have a website written in Ruby using Ruby on Rail framwork, everything was fine when using HTTP protocol, but when switching to HTTPS protocol.
Some CSS material can not shown, but some of it can.
The font can not be shown, originally the font was designed, but now it is not.
Anyone know what happen?
Without any specific error I assume browser is probably blocking files loading from mixed content, i.e. using both HTTP and HTTPS. Use your browser developer tools network tab to confirm this.
You can use // instead of http:// so that resources load from the relative protocol that the page content is loading from; Can I change all my http:// links to just //?
Also read; How to fix a website with blocked mixed content
I'm trying to work on my website but for some reason the web fonts are not working, even though they work fine on my local machine
please have a look on my css codes. its up on github.
css style code
https://github.com/AlexFTWW/alexftww/blob/gh-pages/css/style.css
website
https://alexftww.github.io/alexftww/
and it should look like this. much thinner
http: //prntscr.com/45krlw
on chrome console
[blocked] The page at 'https://alexftww.github.io/alexftww/' was loaded over HTTPS, but ran insecure content from 'http://fonts.googleapis.com/css?family=Roboto:100,100italic,300,300italic,400,400italic': this content should also be loaded over HTTPS.
just change the url to:
https://fonts.googleapis.com/css?family=Roboto:100,100italic,300,300italic,400,400italic
note: the website use a secure protocol (https) , the external resources wold be loaded using https protocol