It's not that easy to debug a code without being able to test different ideas. I am not sure why you do your menu like you do. Your code is:
Code:
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="portfolio.html">Porfolio</a></li>
<li><a href="http://www.mts.net/~ricki01/heavenlybodies/index.html" target="new">Gallery</a></li>
<li><a href="mailto:ricki01@mts.net">Contact</a></li>
</ul>
<img src="images/spacer.jpg" />
<img src="images/games.jpg" />
Why have you added ' /' at the end of the IMG tags? If I am not wrong that is not valid code.
Why not like this instead:
Code:
<a href="index.html">Home</a><br>
<a href="services.html">Services</a><br>
<a href="about.html">About Us</a><br>
<a href="portfolio.html">Porfolio</a><br>
<a href="http://www.mts.net/~ricki01/heavenlybodies/index.html" target="new">Gallery</a><br>
<a href="mailto:ricki01@mts.net">Contact</a><br>
<img src="images/spacer.jpg" height="20"><br>
<img src="images/games.jpg">
In your CSS file give the DIV a absolute position in pixels. You are using a spacer-image. Just add a height attribute and push the games.jpg image as far down as you want.
Maybe I am completely out of track but I guess that this would work in "every" browser.
Also, check this link:
Validator
/Moltas