position: absolute;
top: 130px;
left: 0;
width: 134px;
color: #000000;
height: 600px;
}
#navigation ul {
margin: 0 0 1em 0;
padding: 0;
list-style: none;
text-color:#FFFFFF;
}
#navigation ul a {
color: #000000;
text-decoration: none;
display: block;
background: #00A062;
padding: 0 0.5em;
margin: 0 1em 1px 1em;
}
#navigation a:visited {
color: #FFFFFF;
}
#navigation a:hover {
background: #FF000F;
}
The webpage which has the menu in it looks like this:
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="departments_main.html">Departments</a></li>
<li><a href="index.html">Specials</a></li>
<li><a href="index.html">Recipes</a></li>
<li><a href="index.html">Healthy Eating</a></li>
<li><a href="contact_main.html">Contact Us</a></li>
</ul>
</div>
In my browser it shows up like this:
Home
Departments
Specials
Recipes
Healthy Eating
Contact
While in preview it shows up like this:
Departments
Specials
Recipes
Healthy Eating
Contact
I am wondering why this is occuring