external div div + css not variable length with internal div

external div div + css not variable length with internal div

<div class="content">
      <div class="mainnav">
      <ul>
       <li> <a href="#"> HOME </ a> </ li>
    <li> <a href="#"> ABOUT ME </ a> </ li>
    <li> <a href="#"> CONTACT </ a> </ li>
   </ ul>
  </ div>
  <div class="clear"> </ div>
</ div>
* {Margin: 0; padding: 0;}
body {
   position: relative;
   text-align: center;
   margin: 0 auto;
   }
a {
  color: # 666666;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 12px;
  text-decoration: none;
  }
a: hover {
  color: # 990033;
  text-decoration: none;
  }
. content {
   width: 1000px;
   height: auto;
   text-align: center;
   border: # 000000 1px solid;
   }
. mainnav {
   width: 1000px;
   height: 50px;
   margin-left: 0 20 0 20;
   position: absolute;
   top: 20px;
   left: 50%;
   border-bottom: # 666666 1px solid;
   }
. mainnav ul {
  list-style: none;
  }
. mainnav li {
  float: left;
  line-height: 70px;
  display: block;
  margin: 0 20px 0 20px;
  }
. clear {
   clear: both;
   height: 100px;
   }