Ссылки в вопросе дизайна заголовка

Question

Эй, ребята, я планировал добавлять ссылки в свой заголовок, а их проектирование вызывает у меня некоторую проблему. Я собираюсь сделать одно похожее на твиттер, но есть две проблемы, с которыми я сталкиваюсь. Во-первых, когда я меняю цвет фона на одну ссылку, он меняет цвет фона только по ссылке, но я хочу, чтобы он менял фон ссылки с верхней части заголовка в нижней части заголовка. (См. чтобы щебетать, чтобы лучше понять), а также, как я могу изменить цвет фона только активной ссылки? Под активным я имею в виду, что если ссылка ссылается на домашнюю страницу.php и пользователь находится на домашней странице.php, я хочу, чтобы ссылка имела другой цвет фона. Вот код, который я придумал до сих пор:

<div class="littleheader"><div class="logo"><a HREF="index.php"><img class="fleft" src="graphics/little-logo.png" alt="Cliproid" ></a></div> 

<div class="navbuttons"> 
<div class="navigations"> 
<a class="nav">test</a> 
</div> 
<br/><br/> 
</div> 
</div> 

и стили:

div.littleheader 
    { 
     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#aadbba), to(#009933)); 
     background: -moz-linear-gradient(top, #aadbba, #009933); 
     padding: 0.5em; 
     color: white; 
     clear: left; 
     z-index: 1; 
     height: 30px; 
     } 
    .logo 
    { 
     margin-left: 100px; 
     vertical-align: middle; 
     } 
     div.navbuttons{ 
     float: left; 
     text-align: left; 
     margin-left: 50px; 
     } 
.fleft 
{ 
    float: left; 
    } 
.navigations 
{ 
    float: left; 
    vertical-align: middle; 
    margin-left: 10px; 
    } 
a.nav 
{ 
    vertical-align: middle; 
    color: white; 
    } 

Answer 1

Моя первая мысль была бы изменить a.nav:

a.nav { 
    display: block; 
    float: right; 
    line-height: 120px;  /* just an example, line-height causes vertically aligned */ 
} 

и принять это оттуда.

Вам нужно будет плавать всю навигационную панель справа и остальное, но это основной старт.