Как я могу разместить свою навигационную панель дальше на странице?

Question

Итак, я играю с моим навигационным меню на основе спрайтов для моего проекта веб-сайта школы, но я не могу представить, как я могу перемещать навигационную панель, чтобы он двигался вверх, не перетаскивая содержимое или что-то в этом направлении.

Мой CSS:

nav { 
    width:837px; 
    float:left; 
    margin:0px 0px 0px 30px; 
    background:url(../images/withtext.gif) repeat-x; 
    height:79px; 
    }  

#nav ul { 
    margin:4px 0px 0px 0px; 
    padding:0px; 
    list-style:none; 
    } 

#nav ul li {  
    float:left; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:14px; 
    color:#FFFFFF; 
    /*line-height:38px;*/ 
    padding:3px 50px 3px 50px; 
    border-right:1px #00222a solid; 
    margin:7px 0px 0px 0px; 
    } 

#nav ul li a { 
    float:left; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:14px; 
    color:#FFFFFF; 
    text-decoration:none; 
    } 

#nav ul li a:hover {  
    float:left; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:14px; 
    color:#FFFFFF; 
    text-decoration:underline; 
    } 

Как я могу переместить его вверх?

Answer 1

Использование position: relative и отрицательное значение top это один из способов сделать это:

nav { 
    width:837px; 
    float:left; 
    margin:0px 0px 0px 30px; 
    background:url(../images/withtext.gif) repeat-x; 
    height:79px; 
    position: relative; 
    top: -10px; 
}