So I have a HTML,CSS and php project for uni.
While working, I have faced a problem where a <link> code in a file called headerHome.php,that includes the navbar which I include in each file, is not linking to the CSS file(called index.css).
here is the code for reference as well as my files layout :
HeaderHome.php:
.
.
.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Score'em</title>
<link rel="stylesheet" href="CSS/index.css">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" >
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" ></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-Atwg2Pkwv9vp0ygtn1JAojH0nYbwNJLPhwyoVbhoPwBhjQPR5VtM2+xf0Uwh9KtT" crossorigin="anonymous"></script>
</body>
</head>
.
.
profile.php(the file in question) :
<?php include("includes/headerHome.php");
$user = FetchUserInfo($_SESSION['User']);
?>
<div class="ContainerProfile">
<a href="#" id="uploadImage">
<img id="CircleImage" height="128" width="128" src="images/logo.png" alt="Cloud Chen">
</a>
</div>
<?php include("includes/footer.php");?>
The CSS Code :
#uploadImage {
color: transparent;
font-weight: normal;
text-decoration: none;
}
#CircleImage{
border-radius: 50%;
}
.ContainerProfile{
background-color: #44b8f6;
}
Files Layout
Output
Can someone please explain to me what I did wrong ?