CODEWITHSUNDEEP
htmlcss
jinXyie
jinXyie

Reputation: 13

CSS not showing

What I'm trying to do is like this: https://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_black_right, but it seems the code does not read the external CSS file. Here is the HTML code:

<!DOCTYPE html>
<html>
<head>
  <title>Runner To You</title>
  <link rel="stylesheet" href="../../css/style.css">
</head>
<body>

<ul class="ul">
  <li><a href="#home">Home</a></li>
  <li><a href="#news">News</a></li>
  <li><a href="#contact">Contact</a></li>
  <li style="float:right"><a class="active" href="#about">About</a></li>
</ul>

Here is the CSS code:

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
}

li {
  float: left;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover:not(.active) {
  background-color: #111;
}

.active {
  background-color: #4CAF50;
}

Upvotes: 0

Views: 73

Answers (3)

ledalla Vishnu
ledalla Vishnu

Reputation: 1

if you are a newbie it's a good practice keeping all the HTML CSS and js files in the same folder so you can avoid all those lengthy path typing. you can just type the file and and file extension to access if its in the same folder

Upvotes: 0

nbinks1
nbinks1

Reputation: 36

I think you most likely have an issue with the directory hierarchy.

'..' is used to navigate the hierarchy of the file system. '.' is used for the current directory (this is often not used, as most commands will assume the current directory).

If these are used incorrectly, the files will not be found/executed hence your CSS is not being found.

Could you provide your file structure?

Upvotes: 0

Krutik Raut
Krutik Raut

Reputation: 139

 <link rel="stylesheet" href="../css/style.css">

OR

Make CSS folder where your index.html present

<link rel="stylesheet" href="css/style.css">

Will solve the problem

Upvotes: 1

Related Questions