So my CSS doesn't work for some reason. I have searched online and cannot find a problem with it but the CSS is not connecting to the HTML. Here is my code:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="yee.css">.
</head>
<body>
<audio id="yee" src="C:\Users\Jake Coffey\Downloads\yee.wav" preload="auto"></audio>
<center><img src="https://vignette1.wikia.nocookie.net/smashbroslawlorigins/images/1/16/Yee.png/revision/latest/scale-to-width-down/280?cb=20140904202925" onclick="document.getElementById('yee').play();" /></center>
</body>
</html>
This maybe... never mind...
But I got this problem.
Try add / to your link tag end
<link rel="stylesheet" type="text/css" href="yee.css"/>
It's hard to answer because we can't see your file structure.
This href you are using href="css/yee.css" is assuming that your files look like this.
/ project-folder
index.html
/ css
yee.css
The href tells your HTML file where to look for the CSS file. If your CSS file is in the same folder as your HTML file try changing the href to href="yee.css"
Hope that helps!
EDIT:
https://codepen.io/718studio/project/editor/ABPvrZ/
Make sure that you type the href correctly :
href="yourfolder/yourcssstylename.css"
Try to make the link the same level as index.html directed to the css folder.
<link rel="stylesheet" href="yourfolder/css/styles.css">
or only ...href="css/styles.css"> and make sure delete / before css file name.
its always better to specify full address for css file like
href="http://localhost/public/css/yee.css"
and make sure you use correct protocol http:// or https for your server.
ps you can save your site directory as a constant, in order to not check links during deployment
Related
I'm trying to link my css style sheet to my html file using the code
<link ref="stylesheet" href="../landing/css/stylesheet.css" type="text/css"/>
I have checked my directory link and when command clicking on the /landing/css part it takes me to my CSS file
However when I open the file in my browser to preview I cant see any of my CSS styling applying to the file
Thanks for any help in advance
html code
CSS code
browser view when opening file
Change the value for href attribute to:
"css/stylesheet.css"
Remove the earlier part as it takes you out of the folder and then back again in. See if this helps, else reply here further
I am pretty sure that you just have to do css/stylesheet.css. Not sure what the landing part is about
<link rel="stylesheet" href="css/stylesheet.css">
May be you can try this might helpful.
<link href="css/stylesheet.css" type="text/css"/>
From what I observe , you have used double dots in your "href"
You need to link it like this:
<link ref="stylesheet" href="./css/stylesheet.css" type="text/css"/>
My External css file is not linked to my html page.
I had with inside a folder with path
->app-->css-->layout.css
->index.html
In my index.html file I linked it like
<link rel="stylesheet" type="type/css" href="app/css/layout.css">
it won't link it.
i searched for the file in the chrome (inspect-->sources) and the css file wasn't listed there
I then put the layout.css and index.html in the same path.
<link rel="stylesheet" type="type/css" href="layout.css">
it still didn't work. I checked in multiple browser like chrome and firefox as well but it didn't work.
Not sure if it is causing the error(most probably is), but type should be text/css instead of type/css.
Just replace the type/css to text/css and there is no need to write full path name in href.
You can directly use the command below to get the desired result
<link rel="stylesheet" type="text/css" href="layout.css">
Its a very common mistake that everyone do... Please notice that here type="text/css" not
type/css...
Regards,
Om Chaudhary
I'm working on an real-time chat app with MEAN stack , I begin with html and css , and i'm working on cloud9 platforme, my problem is that i can't add the css file to html !! i tried many time to change the path of my css file but still doesn't work for my :
<link rel="stylesheet" href="psirt/client/views/main.css">
The path to html file and css file is :
psirt>client>views>index.ejs which contains the html code
psirt>client>views>main.css for the css file
any help please ? thnx a lot!!
Try adding a / before the path. Like this:
<link rel="stylesheet" href="/client/views/main.css">
(if your project root is psirt)
Alternatively, just use:
<link rel="stylesheet" href="main.css">
Have you tried adding type of the document to the link tag? See the example:
<link rel="stylesheet" type="text/css" href="psirt/client/views/main.css">
Also, you might want to redefine your drectory for the href.
inspect your code. I think your framework may set any basepath for your code. So your host calling that link and results in error. But i am not sure about it
This is the most silliest question but I dont know why I can't find the problem! Below is the code but css file is not loading.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Title</title>
<link rel="stylesheet" type="text/css" href="css/layout.css" />
</head>
<body>
<section id="mainWrapper">
Hello
</section>
</body>
</html>
I checked the source in the browser, it cannot find the file specified! I tried to move file in the root and removed the folder name still the same. It is just the basic template that I was designing and I can't get CSS working!!!
Check the file name,sometimes when you rename via PC it tends to add layout.css.txt change the file name to just .css.
Move the file to the root where you have you HTML don't create any sub-folders for time being.
Please mention if your trying to upload to a server or just practicing,so we can give you precise instructions.
Try with full path
<link rel="stylesheet" type="text/css" href="http://domainname/css/layout.css" />
Also make sure file is accessible.
Another tip would be to check that the element ids that the CSS file is using are the same as those outlined in your index.html. If they are different the CSS will not be applied.
You can do it with specifying the path for it,
if you are using windows : go to your css file and click on properties where you will find the path for your css file, just copy and paste it in the below code.
Now confirm that with the path you have added the name of your file. Sometimes the relative paths are not working, you would need the full path. So, above is the procedure.
<link rel="stylesheet" type="text/css" href="add your full path here" />
Note: must see the name of file is included in the path you have copied if not do write it by your own.
If I try and link my CSS to my HTML page with either cssstyle2.css ||fifastream1.0/cssstyle2.css or even %fifastream1.0%/cssstyle2.css it wont display any of the CSS on the webpage. (FF, IE, Chrome). I've uploaded my CSS page to stackoverflow before and apparently its fine.
Obviously its no good if I can only get my webpage to 'properly' work on my drive. Soo any idea's why FF, IE or Chrome cant pick up my CSS?
Been working on this for a few weeks now, as a complete beginner. Would be great help if someone could find the answer! I've searched and tried everything.
This is the link in the of the HTML (if this helps at all)
<!DOCTYPE html>
<html>
<head>
<link href="C:///*****/******/Desktop/FifaStream1.0/cssstyle2.css" rel="stylesheet" type="text/css" media"screen"/>
<title> Fifa Stream </title>
</head>
<body>
When everything is in the same foldre you should use the following:
<link href="cssstyle2.css" rel="stylesheet" type="text/css" media"screen"/>
When you're CSS file is in a different folder use:
<link href="folder/cssstyle2.css" rel="stylesheet" type="text/css" media"screen"/>
If your CSS file is one directory above the html file then use:
<link href="../cssstyle2.css" rel="stylesheet" type="text/css" media"screen"/>
To have relative referencing, ur CSS needs to be in at least somewhat referential place. for example, if the page is in Users/whatever/index.html, your CSS would be in Users/whatever/css/style.css. Then your reference would be to "css/style.css"
A quick reference guide:
<!--
./filename or filename = same folder as page location
../filename = folder above that of page folder location
/filename = root folder of project
-->
If your CSS file is in a completely different location than your page file, it can't possibly be found unless you provide the full path as you had to.