most of my css files are not working in firfox but loaded.the same css are working fine in chrome
hi i'm trying to open my website in firefox but the problem is many css files are not loading in firefox.but there is no issue in loading them. they are loaded in the page but not working.the same files and css inside are working well in chrome.here i give my website link please someone open it in both firefox and chrome and assist me where it goes wrong.https://www.office-deals.nl/ . i have added 2 images below for showing particularly one content from many.the black bg is the chrome image and the white is for the firefox.in black i have a class named owl-item where the corresponding css from owl-carousel.css are loaded fine .but in white bg image the css is not displaying but the files are loaded in the page. i give you the structure of my files that i have in my header.
<link rel="dns-prefetch" href="//www.google.com"> <link rel="dns-prefetch" href="//www.google.nl"> <link rel="dns-prefetch" href="//www.google-analytics.com/"> <link rel="dns-prefetch" href="//www.googletagmanager.com"> <link rel="dns-prefetch" href="//connect.facebook.net">
<link rel="preconnect" href="//www.google.com" crossorigin> <link rel="preconnect" href="//www.google.nl" crossorigin> <link rel="preconnect" href="//www.google-analytics.com/" crossorigin> <link rel="preconnect" href="//www.googletagmanager.com" crossorigin> <link rel="preconnect" href="//connect.facebook.net" crossorigin> <link rel="stylesheet" href="https://css.office-deals.nl/bootstrap.min.css"> <link rel="stylesheet" href="https://css.office-deals.nl/main.css?v=2.1">
<link rel="preload" href="ext/assets/css/font-awesome.min.css" as="style" onload="this.rel='stylesheet'">
<link rel="preload" href='https://fonts.googleapis.com/css?family=Open+Sans&display=swap' as="style" onload="this.rel='stylesheet'"> <link rel="preload" href="https://css.office-deals.nl/owl.carousel.css" as="style" onload="this.rel='stylesheet'"> <link rel="preload" href="https://css.office-deals.nl/owl.transitions.css" as="style" onload="this.rel='stylesheet'"> <link rel="preload" href="https://css.office-deals.nl/animate.min.css" as="style" onload="this.rel='stylesheet'"><link rel="preload" href="https://css.office-deals.nl/bootstrap-multiselect.css" as="style" onload="this.rel='stylesheet'"> <script src="https://js.office-deals.nl/jquery-1.10.2.min.js"></script> <link rel="apple-touch-icon" sizes="180x180" href="favicons/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="/favicons/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicons/favicon-16x16.png"> <link rel="manifest" href="/favicons/site.webmanifest"> <link rel="mask-icon" href="/favicons/safari-pinned-tab.svg" color="#86c341">
hi i'm trying to open my website in firefox but the problem is many css files are not loading in firefox.but there is no issue in loading them. they are loaded in the page but not working.the same files and css inside are working well in chrome.here i give my website link please someone open it in both firefox and chrome and assist me where it goes wrong.[https://www.office-deals.nl/ https://www.office-deals.nl/] . i have added 2 images below for showing particularly one content from many.the black bg is the chrome image and the white is for the firefox.in black i have a class named owl-item where the corresponding css from owl-carousel.css are loaded fine .but in white bg image the css is not displaying but the files are loaded in the page.
i give you the structure of my files that i have in my header.
<link rel="dns-prefetch" href="//www.google.com">
<link rel="dns-prefetch" href="//www.google.nl">
<link rel="dns-prefetch" href="//www.google-analytics.com/">
<link rel="dns-prefetch" href="//www.googletagmanager.com">
<link rel="dns-prefetch" href="//connect.facebook.net">
<link rel="preconnect" href="//www.google.com" crossorigin>
<link rel="preconnect" href="//www.google.nl" crossorigin>
<link rel="preconnect" href="//www.google-analytics.com/" crossorigin>
<link rel="preconnect" href="//www.googletagmanager.com" crossorigin>
<link rel="preconnect" href="//connect.facebook.net" crossorigin>
<link rel="stylesheet" href="https://css.office-deals.nl/bootstrap.min.css">
<link rel="stylesheet" href="https://css.office-deals.nl/main.css?v=2.1">
<link rel="preload" href="ext/assets/css/font-awesome.min.css" as="style" onload="this.rel='stylesheet'">
<link rel="preload" href='https://fonts.googleapis.com/css?family=Open+Sans&display=swap' as="style" onload="this.rel='stylesheet'">
<link rel="preload" href="https://css.office-deals.nl/owl.carousel.css" as="style" onload="this.rel='stylesheet'">
<link rel="preload" href="https://css.office-deals.nl/owl.transitions.css" as="style" onload="this.rel='stylesheet'">
<link rel="preload" href="https://css.office-deals.nl/animate.min.css" as="style" onload="this.rel='stylesheet'">
<!--<link rel="preload" href="https://css.office-deals.nl/datepicker.css" as="style" onload="this.rel='stylesheet'">-->
<link rel="preload" href="https://css.office-deals.nl/bootstrap-multiselect.css" as="style" onload="this.rel='stylesheet'">
<script src="https://js.office-deals.nl/jquery-1.10.2.min.js"></script>
<link rel="apple-touch-icon" sizes="180x180" href="favicons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicons/favicon-16x16.png">
<link rel="manifest" href="/favicons/site.webmanifest">
<link rel="mask-icon" href="/favicons/safari-pinned-tab.svg" color="#86c341">
All Replies (3)
<link rel="preload" /> doesn't work in Firefox yet by default.
TyDraniu said
<link rel="preload" /> doesn't work in Firefox yet by default.
but my css are loaded in this page but not working
Modified by jeenussvd
See:
- Bug 1583604 - (rel=preload) [meta] rel=preload
(please do not comment in bug reports
https://bugzilla.mozilla.org/page.cgi?id=etiquette.html)