Posição independente numa div

[juan 0]

Galera, estou fazendo um menu com estilo winXP, hehehe, mas a imagem ficou muito alta, como eu posso abaixá-la um pouco sem ter que colocá-la em outra div? estou usando lista (<li> e <ul>) para este menu... Antes eu não conseguia posicioná-lo na Horizontal, mas resolvi com display:inline; agora a imagem ta muito pra cima! hehhe

 

 

O código da div é só uma lista com uma classe definida:

<div id="menu"><ul><li class="home"><a href="index.html"><img src="imagens/site/home.png" /> Inicial</a></li><li><a href="#">Fórum</a></li></ul></div></div>

aqui o código CSS da lista só, e seus estados (hover e active q eu usei):

 

#menu {position:fixed;top:-12px;}#menu li {padding:15px;text-align:center;font-family:verdana;display:inline;list-style-type:none;font-size:12px;}#menu ul {padding: 3px;text-align:left;}#menu li:hover {background:url(imagens/site/fundo.png) no-repeat;background-repeat:no-repeat;background-position:center;}#menu li:active {background:url(imagens/site/fundopressed.png) no-repeat;background-repeat:no-repeat;background-position:center;}

[micox 2]

<li class="home"><a href="index.html"><img src="imagens/site/home.png" /> Inicial</a></li>

Você não deve usar tag img pra fazer design.De acordo com a w3c, a tag IMG só pode ser usada quando fizer parte do conteúdo.Pra voce colocar uma imagem lá, o certo é usando background através do seu CSS.Dá um id para cada elemento do seu menu e aplica a imagem nela através de background.ex:

<style>#home { background: #F1EEE3 url(imagens/site/fundo_home.png) no-repeat}</style>...<li id="home"><a href="index.html">Inicial</a></li>

Mais ou menos isso ae...

[pa_bruno 0]

mexa no padding-top... para posicionar... ou entaum no line-height...

 

fora q você usou pseudo classes no li... naum funciona no i.e. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif