I am working on a webpage. I am trying to make a default navigation bar for all my pages, this is my file I want to include()
my navigation bar in:
<html>
<head>
<title>My Webpage</title>
</head>
<body>
<?php include("config/defaults/nav/navigation.php"); ?>
</body>
This is working fine, but how do I add my CSS? The css is just for the navigation bar, it is in the location C:/xampp/defaults/nav/styles.css
. In navigation.php
is the link to the stylesheet, but that doesn't work.
EDIT:
This is the content of navigation.php, it's just my navigation bar:
<html>
<head>
<link href="styles.css" rel="stylesheet" type="text/css">
<script src="nav.js" type="text/javascript"></script>
</head>
<body>
<div class="nav">
<div class="nav_wrapper">
<ul>
<li><a href="#">Home</li></a>
<li><a href="#">Mods</li></a>
<li><a href="#">Search</li></a>
<li><a href="#">Help</li></a>
</ul>
</div>
</div>
</body>
</html>
I know it is very basic.
EDIT 2:
The path to the navigation.php is just C:/xampp/htdocs/config/defaults/nav/navigation.php
, where htdocs is my root folder.
There are a couple of things to note here, you do not need to include the whole <html>
markup bit in your include. This itself will confuse the web browser and make things go wierd, especially as the page gets more complex and if you put in the correct link path it may still not work.
In navigation.php all you need is the actual html markup:
<div class="nav">
<div class="nav_wrapper">
<ul>
<li><a href="#">Home</li></a>
<li><a href="#">Mods</li></a>
<li><a href="#">Search</li></a>
<li><a href="#">Help</li></a>
</ul>
</div>
</div>
Also looking at the path for you navigation style.css
file it looks like you want to have different style.css files for different parts of the page in different directories, I would highly recommend bringing all of your styles together into one single file and having a main stylesheet i.e. main.css if only to make maintaining it easier, or at least bringing all of the stylesheets into same directory (and call them main.css, navigation.css as an example).
That way with in the main index page all you have to do is include the styles and you will find it much easier to manage going forward.
To actually answer your main question now, the reason your style include doesn't work is because it is looking for style.css in the root of your web directory when in reality it is in the folder /defaults/nav/
(assuming that C:/xampp is the website root. Changing the link to include that directory structure will solve the problem:
<link href="/defaults/nav/style.css" rel="stylesheet" type="text/css"/>
The path will need to point to wherever the style.css file is located, if you take my advice above then it will be different. I would create a css directory in the root and put it in there so the path would be /css/style.css
then if you also have to include any other CSS related files they can all go in there which will help keep things tidy.
Best of luck and your English is pretty good, not 100% perfect but I understood your question easily.