I just asked this question: Why is Font Awesome only showing a square?.
The gist of it is that my font-awesome.min.css file was not working. I was getting 404 errors when trying to load icons from it. Someone gave the ridiculous suggestion of changing:
<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
to
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
I tried their suggestion with confidence that it would not change anything, but it worked!
The code in MyProject/font-awesome/css/font-awesome.min.css (the filepath is correct) is identical to the code at //maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css.
Why is it that the CDN works, but my local copy gives me 404 errors?
Some clarification:
The file is being found when I try to link to the relative file (not using the CDN). The images within the CSS come up with 404. But with identical code at the CDN, there is no 404 for the images. I get the following error for each respective image:
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:63343/MyProject/font-awesome/fonts/fontawesome-webfont.woff2?v=4.3.0
The CSS file refers to font files using relative URLs. So when you copy the CSS, you also have to copy the font folder to MyProject/font-awesome/fonts.
Basically, when you download the Font Awesome ZIP file, you should extract the entire thing into MyProject/font-awesome. This will get you the all the files and they'll be in the proper location.
You are pointing to the absolute url. Try changing it to relative to Home page. Ex: /font-awesome/css/font-awesome.min.css.
Related
I have placed my CSS and Images folders and index.html on GitHub. Only the html displays without the CSS formatting. I have cleared my cache and cookies. I'm using Chrome. I can't seem to get the CSS formatting to work.
Can anyone help?
uploaded web files to Github: https://github.com/Dennybribri/cv
I have attached a picture of how the top part of the website should look like. Here is a link to the site from Github that just displays the html: https://dennybribri.github.io/cv/
Rename your folder from CSS to css.
The filesystem used on the servers of Github pages sites is case sensitive.
You'll need to import your css from the CSS folder:
<link rel="stylesheet" href="CSS/styles.css">
Also because of the same problem your images will not show up. You will need to specify the path to Images/someimage.jpg instead of images/someimage.jpg
Thank you Mahmoud and Merlin. I changed the folder names to lower case and forever have this issue stuck in my brain. It works great!
So to keep it short: I am trying to implement an image, but the image keeps on throwing in the error GET http://localhost/keuzedeel/images/naturebg.jpg 404 (Not Found) and then displays nothing...
Even though (according to me) I have the right file path.
I have a CSS folder with a css file in it
I have a js folder (what won't be very useful in resolving this, but just mentioning in case)
I have an images folder
I have the root folder named "keuzedeel"
this is how my HTML header looks like:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/mainpage.css">
This is how I try to create the background image in my css file: background-image: url('/keuzedeel/images/naturebg.jpg');
Yes, the extension is a .jpg.
I have looked into a couple of StackOverflow questions, but none of them have helped. Could it maybe be a 403? (access denied)
I tried to create a grid using UI grid (Recent version of ngGrid) which is unstable version and integrated in my current project.
It is Not correctly displaying the (icon angle down and row selected icon) as needed While including the CSS file in project (by downloading the file and uploading) its giving me display errors as shown below.
But, if i directly give the web url for CSS file in my project...it is displaying correctly.
//web url:
<link rel="stylesheet" href="http://ui-grid.info/release/ui-grid-unstable.css" type="text/css">
//my url
<link href="~/Scripts/ui-grid-unstable.css" rel="stylesheet" />
I don't want to depend on web URL to display...is there any solution that I can implement on my side.
Please refer the image for before and after using web link.
link for Images: http://postimg.org/image/omhlfs8nd/
The top one is how it's supposed to and the bottom one explains my display error.
ThankQ for your time.
This is a simple error. Make sure you have the ttf,woff and svg files from the ui-grid download in your css folder. From you code, you should have it under ~/Scripts/ folder.
Adding to previous comments to download tff, svg and woff files:
You need to download ui-grid.eot as well to get it perfect.
I have a website hosted by siteground, and my custom 404 page is SOMETIMES missing it's stylesheet. I contacted support but they saw it working fine, assumed I just codded it wrong, and told me to get help form a professional web programmer... (of course I did test before contacting them to be sure it was not my fault)
Anyways, the way that siteground allowes you to create a custom 404 page is to add your html code to a form in your control panel, wich creates a 404.shtml in your main folder. The .shtml contains all your html. I have done the following test to narrow down the problem.
created a not404.html in my main folder with code copy pasted from my 404.shtml that is in the same folder. It loaded with my stylesheet applied no problem.
tried prompting a 404 page with both bad hyperlinks, and by typing pages that do not exist. When I am having the problem with my stylesheet missing, none of thease pages have css, but when I am not having the problem, they all have css applied.
What I think it is: I think that the 404.shtml is not really in my main folder, but just appears to be there, and sometimes that link breaks and the 404.shtml is actualy acessed somewere else on sitegrounds server, therefor the style link would not work properly. This would explain the intermittent css failor. But this is just logic, not understanding.
The only thing I can think of that would be wrong on my end is if there is more than one way to link stylesheets, and my way is a bit unstable. Here is the format I use.
<link type='text/css' rel='stylesheet' href='css/404.css'>
I know this might be a difficult question, but it would be pretty satisfying to figure this out and inform them of the problem with their site.
Change the href for the style tag to be absolute. So this:
<link type='text/css' rel='stylesheet' href='css/404.css'>
Becomes this:
<link type='text/css' rel='stylesheet' href='/path/to/css/404.css'>
css/404.css is a relative path. If the path is something like /path/to/nonextant/page it will try to load the stylesheet from /path/to/nonextant/page/css which does not exist.
Use an absolute path:
/css/404.css
Am running asp.net web application.I need to modify the appearance of my web page..I want to bring a table that contains some labels and textbox to the centre of the page..I changed the align to centre..it is not working...i changed the padding pixels which is in default...it is also not working out...i feel CSS in not applying..can anyone help me to slve this..
you can use margin to bring it to center
Check that the CSS file path you are provided in page is right.
for example :
<link href="css/site.css" rel="stylesheet" type="text/css" />
the above line should be inside head tag
here "css" folder is inside project root directory, and site.css is inside that "css" folder
so check the path of css file
Check the path which the browser attempts to resolve in e.g. firebug or fiddler, and check the status and content of the response. A common scenario is that you haven't granted permission or authorised access to the CSS folder so you'll get a 4xx range response, or worse a 200 response which is actually a custom error page.