Im trying to use Skeleton Boilerplate. I downloaded the basic zip, comes with images folder only holding a favicon, normalize.css, skeleton.css, and a very basic index.html. When I try styling the index with my own linked css, just a basic thing like a background color on the single div, or changing the text or title, it takes FOREVER to refresh the page. Its supposed to be super lightweight and looks to be, idk whats going on
Remove the 'Font' link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css" from index.html Skeleton and it should work at correct speed. It was what was slowing it down on my comp. Hope it helps.
Actually you just have to add the "https:" to the link.
Thats it!
Loading jQuery remotely is probably why you are having loading issues. In particular, if you download jQuery and replace <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> inside index.html to point to your locally downloaded version of jQuery, things should be as fast as expected.
As Thinnling said, you should remove or edit the Google Font link.
index.html:
Old:
<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
New:
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
skeleton.css:
(line 123)
body{ font-family: 'Raleway', sans-serif; }
Related
hello Laravel developers!
I am stuck with Laravel assets URLs.
<link href="/css/app.css" rel="stylesheet">
this link works fine on localhost.
But why i need to add "public" when i upload it to server like
<link href="/public/css/app.css" rel="stylesheet">
I moved app/public/index.php to app/index.php and make changes in server.php and index.php accordingly. Rest is the working fine. issue is only with assets urls.
Similarly, the class
.edu-home-hero-area {
background: url(/assets/images/curve.webp) !important;
}
works fine on localhost but when i upload it, it does not work i need to change it to
.edu-home-hero-area {
background: url(/public/assets/images/curve.webp) !important;
}
please have a look
https://pdaofficial.com/
any help would be appreciated
I'm not sure if i understand your question completely but you should not be moving public folder files some where else. why not reference your css or js assets using asset function. It will directly point to public folder and look for build.css inside css folder.
<link type="text/css" rel="stylesheet" href="{{ asset('css/build.css') }}">
I've been developing a site with bootstrap 4 and linking externally to:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
However, I need to load the site locally as the network connection isn't stable. So I downloaded the full stack bootstrap-4.0.0 Source file and added it to my WebServer directory thinking all I need to do is change the link to to point to bootstrap.min.css, like this:
<link rel='stylesheet' href="http://localhost/webfiles/wp-content/themes/Cussons/bootstrap-4.0.0/dist/style.css?ver=4.9.4">
The site works, but I'm getting a 404 not found for style.css?ver=4.9.4
All permissions at set to allow full access and I cleared caches and all of the links href's appear correct, but I cant seem to get my head around why the site wont pick up the color changes I've added to files like /assests/scss/_navbar.ccss
If anyone can see whats wrong, I'll be very grateful :)
Just download the precompiled files here, place them in an accessible folder and then link them like :
<link rel="stylesheet" href="relative_path_to_css_parent_folder/css/bootstrap.min.css">
same for the js at the bottom of the body :
<script src="relative_path_to_js_parent_folder/js/bootstrap.min.js">
or
<script src="relative_path_to_js_parent_folder/js/bootstrap.bundle.min.js">
Take a look at this : How do I link to my css stylesheet for local file?
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="UI.css"> <!-- made up name-->
<script src="jquery.js"></script><!-- made up name-->
<script src="jquery.ui.js"></script><!-- made up name-->
<script src="script.js"></script>
But what if the js files are all in the projects/js/ folder? Point
your page to this location:
Assuming our HTML is in the blackjack folder, which is a sibling
folder to 'projects/js', then your script tags will look something
like this:
<script src="../js/script.js"></script>
Notice the ../? This references the parent folder of the one the
document is in. We go up one level to where the js folder is.
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.
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.
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