Bootstrap doesn't work in Firefox browser - firefox

I have a Bootstrap form made, but it doesn't appear correctly in Firefox... All other browsers seem to work. I've tried everything!
Here's the link: http://www.redmandesign.ie/bootstrap/form1.html
I think it's related to the bootstrap style sheet but I'm not sure.
Can anyone help, I'm really stuck!!!

<link href="css\bootstrap.css" rel="stylesheet">
<link href="css\bootstrap-responsive.css" rel="stylesheet">
Should be changed to:
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
Explanation: Firefox is sending a request for a file called css\bootstrap.css instead of asking for bootstrap.css in the css folder, which doesn't exist and the server replies with a 404 error. Don't you just love the subtle difference between the types of slashes? :P

In firefox , when you check for this link https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css. It shows this connection is untrusted. Accept it and Procced it from the browser. Now run the bootstrap file, it should work.

Related

Error 404: https://fonts.googleapis.com/css

One module in our Prestashop platform inserts the google link below:
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,regular,500,600,700,100,200,800,900%7CDM+Serif+Display:regular,italic&subset=latin%2Clatin-ext?ver=8739" type="text/css" media="all">
But the browser reports ERROR 404: But when I insert and check the URL into the browser manually - it works?
Does this kind of google link needs to be ref. to in a special way or does any other tags need to be added to it before it will work?
To be honest I'm not 100% sure how I got this right by click around in the dev. console. But this URL here works:
https://fonts.googleapis.com/css?family=Poppins:300,regular,500,600,700,100,200,800,900%7CDM+Serif+Display:regular,italic&subset=latin%2Clatin-ext?ver=7489

In springboot css and js files not loading in jsp file

In spring-boot application, pointed all css, js, images are in below structure:
JSP page is loading with all css/js/images when the URL is like this http://localhost:8080/request/
But when the URL is like this http://localhost:8080/request/rt/home
(css/image/js are not loading).
When I click the url of bootstrap.min.css from view source page, it is showing like below:
http://localhost:8080/request/rt/public/css/bootstrap.min.css
"rt" is adding in between the url.
How to omit the "rt" from path.
so that will get path like http://localhost:8080/request/public/css/bootstrap.min.css
It will load css/js/images
Please suggest
Without seeing your jsp, according to your statements of how it behaves, I would say that you are declaring your stylesheet and resources reference this way, without starting by a /:
<link href="public/css/bootstrap.min.css" rel="stylesheet">
<script src="public/css/bootstrap.min.js"></script>
This means that the resources are relative to the virtual directory of the url bar of the browser.
You should declare your references this way:
<link href="/request/public/css/bootstrap.min.css" rel="stylesheet">
<script src="/request/public/css/bootstrap.min.js"></script>
To avoid hardcoding the contextpath, you could use:
<link href="${pageContext.request.contextPath}/public/css/bootstrap.min.css" rel="stylesheet">
<script src="${pageContext.request.contextPath}/public/css/bootstrap.min.js"></script>
Whicho would resolve your context name
Try this way
<link href="/resources/css/bootstrap.min.css" rel="stylesheet">
or
<link href="${pageContext.request.contextPath}/resources/css/bootstrap.min.css" rel="stylesheet">

Mixed content google chrome, cant find the source

Im developing a golang webpage and am running into some troubles when deploying my page to google app engine (appspot.com). This is because Im running it using http when developing on my machine, but over https when deployed.
Google chrome doesnt like this so it blocks the content trying to be loaded over http. Im fine with this since I like security. But I cant find the source.
All my includes are https or //, or just local files.
Here is a image of the error in chrome.
This is some includes that I use. Maybe some of them is loading a font?
<link href="/static/css/googlefont.css" rel='stylesheet' type='text/css'>
<link href="/static/css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="/static/css/style.css" rel="stylesheet" type="text/css">
<link href="/static/css/sweetalert2.css" rel="stylesheet" type="text/css">
<link href="/static/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="/static/css/modal.css" rel="stylesheet" type="text/css">
<script src="/static/js/jquery.js"></script>
<!--<script src="/static/js/jquery.min.js"></script>-->
<script src="/static/js/register.js"></script>
<script src="/static/js/login.js"></script>
<script src="/static/js/sweetalert2.min.js"></script> <!-- Sweetalert -->
<script src="/static/js/spin.min.js"></script> <!-- ?? -->
<script src="/static/js/bootstrap.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="/static/js/jquery.cookie.js"></script>
<script src="/static/js/stuff.js"></script>
<script src="/static/js/flat-ui.min.js"></script>
<script src="/static/js/application.js"></script>
<script src="/static/js/bootbox.js"></script>
I cant seem to find the source..?
Thankful for any help in the right direction, i'm going crazy here..
Check all the CSS stylesheets your document is loading, including any CSS stylesheets that are getting loaded through an #import. In one of the CSS stylesheets, you most likely have a rule with a url(…) call something like this:
src: local('PT Sans'), local('PTSans-Regular'), url(http://fonts.gstatic.com/s/ptsans/v8/fhNmDCnjccoUYyU4ZASaLVKPGs1ZzpMvnHX-7fPOuAc.woff2) format('woff2');
Use the Network tab (or equivalent) in your browser devtools to get a view of all the resources your document is loading. You can sort that resource view by type. So, set it to sort by type and then look through the source of all the type=stylesheet or type=css resources to see which one has a url(…) that uses an insecure http scheme.
If someone hasn't already, there really should be a feature request lodged with Google. The fact that Chrome knows the location of the error but just displays "(index):1" in the developer console just doesn't cut it.
In the meanwhile, the easiest way to find the offending CSS in Chrome (ver 68) is to "Customize and control DevTools" by clicking on the 3 dots in the top right corner of the development console and clicking "Search" ) or "Ctrl+Shift+S". You might have to drag up the horizontal pane at the bottom of the screen.

favicon not showing on inner pages of magento

In one of my magento website I have added favicon using
magento admin panel > system > configuration > design > HTML head > favicon icon
It was displaying nicely in magento home page but not showing in inner pages. I have changed the current configuration scope to store view and did the same proccess. still it is not working. I hacve cleared caches and re-indexed. but it is not working.
Why is it so? How can I solve this?
Thank you.
# jatinder kumar you may need this only?
<link rel="icon" href="http://navaani.in/media/favicon/stores/17/favicon_1.png" type="image/x-icon">
<link rel="shortcut icon" href="http://navaani.in/media/favicon/stores/17/favicon_1.png" type="image/x-icon">
<link rel="shortcut icon" href="http://navaani.in/skin/frontend/base/default/images/dresscode_images/favicon.ico">
<link rel="apple-touch-icon" href="http://navaani.in/skin/frontend/base/default/images/dresscode_images/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="http://navaani.in/skin/frontend/base/default/images/dresscode_images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="http://navaani.in/skin/frontend/base/default/images/dresscode_images/apple-touch-icon-114x114.png">
<link href="//fonts.googleapis.com/css?family=Amaranth:200,300,400,500,600,700,800" rel="stylesheet" type="text/css">
Ask me if you want more. Thank you.
We experienced similar. We resolved this (if I'm understanding your issue correctly) by overwriting the default favicon.ico in the root folder with ours.
Note, browser caching in relation to favicon.ico is extremely zealous :) As such, you will probably only see the change by opening the site in a browser you haven't opened the site in previously or on a different machine.

Printing web fonts in Firefox

I am trying to print web pages that contain external CSS references and use web fonts (I mean #font-face attribute) but in print preview the web fonts disappear. Does anyone know a solution without using the web font locally?
Looks like printing #font-face fonts is not yet implemented:
https://bugzilla.mozilla.org/show_bug.cgi?id=468568
Works as of Firefox 18! - Yippee!
inlcude the file not only for screen but also for print
<link rel="stylesheet" type="text/css" href="main.css" media="screen" />
but include the css also for print
<link rel="stylesheet" type="text/css" href="main.css" media="print" />
in your case the href should then go to an external url

Resources