Unordered list appears higher than div

Posted by LordArmadillo on Stack Overflow See other posts from Stack Overflow or by LordArmadillo
Published on 2013-10-21T15:30:11Z Indexed on 2013/10/21 15:54 UTC
Read the original article Hit count: 145

Filed under:
|

I am trying to create a simple page, which I normally can without any trouble. However, the unordered list appears higher up the page than the div. I do know a solution for this, however I cannot remember it. The page goes like this:

<style>
ul.menu {
 list-style-type: none;
 margin:150;
 margin-bottom:30px;
 padding:0;
 display: block;
 width: 708px;
 margin-left: auto;
 margin-right: auto;
} 
li.menu
{
 float:left;
 display: block;
 width: 118px;
} 

a.menu:link,a.menu:visited
{
 color:black;
 display:block;
 border:1px solid black;
 background-color:#FFFF00;
 width:118px;
 text-align:center;
 text-decoration:none;
 font-family:"Courier New", Courier, monospace
}

a.menu:hover
{
 background-color:#FFBB11;
} 
</style>

<div id="head"> My images here & such</div>

<ul class="menu">
    <li class="menu">
         <a class="menu">Main</a>
    </li>
</ul>

Normally I welcome suggestions to change my code, but I have a deadline today! So, quick & simple help would be appreciated! Thanks! LordArmadillo

© Stack Overflow or respective owner

Related posts about html

Related posts about css