Hey everyone,
I haven't been on here in a while and I have probably a stupid error somewhere but anyway, I have three files: one is a php(header) file and the other is a css file linked into the index page. I think I've coded the php and I'm pretty sure I've coded the css for the apparent div correctly but my issue is regardless of the fact that my code looks correct, my menu list seems to still be stacked virtically and isn't moved over to the right. Can anyone help me figure out why? As I've said before, It's probably a stupid simple error that I'm just not seeing. Thanks!
html_codes.php
<?php
include('includes/connect.php');
//Code for Header and Search Bar
function headerAndSearchCode(){
$defaultText = (isset($_GET['keywords']));
echo '
<header id="main_header">
<div id="rightAlign">
';
topRightLinks();
echo "
</div>
<a href=\"index.php\"><img src=\"Img/Logo.png\"></a>
</header>
<div id=\"top_search\">
<form name=\"input\" action=\"search.php\" method=\"get\">
<input type=\"text\" id=\"keywords\" name=\"keywords\" size=\"100\" class=\"searchBox\" value=\"$defaultText\">
<select id=\"category\" name=\"category\" class=\"searchBox\">
";
createCategoryList();
echo '
</select>
<input type="submit" value="Search" class="button" />
</form>
</div>
<div id=\"menu">
<ul>
<li><a href=\"#">Home</a></li>
<li><a href=\"#">Link 1</a></li>
<li><a href=\"#">Link 2</a></li>
<li><a href=\"#">Link 3</a></li>
</ul>
</div>
';
}
?>
styles.css
#menu ul {
float: left;
width: 100%;
padding: 0;
margin: 0;
list-style-type: none;
}
#menu ul li {
display: inline;
}
#menu a {
float: left;
width: 6em;
text-align: center;
text-decoration: none;
color: #000;
background-color: #fff;
padding: 0.2em 0.6em;
border: 1px solid #000;
}
#menu a:hover {
background-color: #000;
color: red;
}
index.php
<?php
session_start();
include("includes/connect.php");
include("includes/html_codes.php");
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Sample</title>
<link rel="stylesheet" href="CSS/styles.css" type="text/css" media="screen" />
</head>
<body>
<div id="wrapper">
<?php headerAndSearchCode(); ?>
<?php footerCode(); ?>
</div><!-- and of #wrapper div -->
</body>
</html>