HTML ignores css file [closed] - html

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 3 years ago.
Improve this question
I have HTML file with <link rel="stylesheet" href="dist/css/style.min.css"> in head and my custom.css file.
Why my custom.css file is ignored - I cannot style image or padding while using devtools in the browser I can simply manipulate it (?)
It seems like I could only use inline styles which is unacceptable.
I have only two css files in head:
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Zadanie 1</title>
<link rel="stylesheet" href="dist/css/style.min.css">
<link rel="stylesheet" href="dist/css/custom.css">
</head>

If your file is named 'custom.css' then you need to include that in the href.
<link rel="stylesheet" href="path/to/custom.css">

Did you include your css file in your header?
It should look like this:
<head>
<link rel="stylesheet" type="text/css" href="custom.css">
</head>
Also make sure that the file is located in the same folder as the HTML file unless you change the href to point to a subfolder.

Related

Using href in html [closed]

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed last month.
Improve this question
I have been asked to copy the font awesome link and paste it into the head area of the HTML : <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css" /> I need to place this above the link to the index.css file.
This is the code that I have already been given:
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>repl.it</title>
<link href="index.css" rel="stylesheet" type="text/css" />
</head>
Below is where I have added the href and the <link rel="stylesheet" but it doesn't accept it so not sure where I have gone wrong. I have left a space between where I have added the code, please let me know your thoughts, thanks.
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>repl.it</title>
<link href:"https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css"/>
<link rel="stylesheet/>
<link href="index.css" rel="stylesheet" type="text/css" />
</head>
How about this?
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css">

Why CSS file not working in my application? [duplicate]

This question already has answers here:
Complete list of reasons why a css file might not be working
(25 answers)
Closed 10 months ago.
I'm trying to use .css files in my project but it doesn't work. The directory hierarchy is: /resources/static/css/style.css. In my html file I tried
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Header</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href = "/css/style.css" th:href="#{/css/style.css}" >
</head>
but it does not work. What to do to make the style work? I read several articles but did not understand how to solve the problem
When using / at the start of your href address you are addressing from the root. so you should change the CSS link to this:
<link rel="stylesheet" href = "/resources/static/css/style.css" />
or just link it relatively with ./
for more information read this :
having-links-relative-to-root
try to add type="text/css"
and adding dot to href="./your/location/style.css"

Class background defined in .css not showing on webpage. Path to image not recognized. Why? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 1 year ago.
Improve this question
I made a most basic html and a most basic css. I want to begin by putting a background image. I do not want the style to be defined in the html but in the separate css file.
I did this:
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>The Ultimate Movies DB</title>
<meta content="A Movie Database" name="description">
<meta content="Movie, Database, API" name="keywords">
<!-- Import own files -->
<link rel="stylesheet" href="static/css/style.css">
</head>
<body>
<div class="first-div">
</div>
<script src="static/js/script.js"></script>
</body>
</html>
and
style.css:
.first-div {
background-image: url("../img/home.jpg");
background-size: cover;
}
but the background image is not showing.
Project structure:
This is the message from the browser console:
Failed to load resource: the server responded with a status of 404 (Not Found) home.jpg
the image is not recognized.
I put a relative path to the image from the css file. I tried several combinations of how to write the path but I cannot figure out what goes wrong.
There is a path error in the css file being called in index.html. The correct path will be <link rel="stylesheet" href="../static/css/style.css"/>

Using neocities and can't link the CSS to HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>an infinite endeavor</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
</head>
<body>
The CSS is a separate file, and I've been searching for hours for a solution.
https://i.stack.imgur.com/3GdHj.png
This is troubleshooting, so I will give you three viable answers.
Maybe your css file is not in the same directory as your HTML file.
If you are loading this locally, remember to write the ENTIRE file location ex: C://User/desktop/styles.css
If none work, think about just copypasting the entire css code and putting it inside a tag.
Is your CSS file in a CSS folder? If so do not forget to add css/ to entering your CSS folder.
<link rel="stylesheet" href="css/style.css">
or try like this
<link rel="stylesheet" href="/style.css">

CSS doesn't respond and also the Images don't load

The main.css is located in a folder named css, and the index.html is outside the folder.
<head>
<title>Tornike's Page</title>
<link rel = "stylesheet" type="text/css" href = "css/main.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
My Code
The Website and developer tools
I think you don't have folder structure. If you really have it and does not works then you can try ./css/main.css. Otherwise I'd tried to go with main.css.
I fixed it guys, Just needed to edit my path so it would say : "Website/css/main.css" , Thanks for answers.