Menu usando CSS Sprite

[gguimaraes 0]

Preciso da ajuda de vocês.

 

Estou querendo criar um menu com uma imagem usando CSS Sprite.

 

Tenho uma figura que é a imagem do menu. Mas como o menu pode variar de tamanho, gostaria de usar a imagem que tenho para montar o menu de acordo com o tamanho dele, sem precisar criar uma imagem pra cada menu. É possível ou tenho que separar em 3 figuras pra montar um menu dinâmico (top, center, bottom)?

 

Bom, deixa eu colocar um exemplo. Imagine que o HTML que eu uso é esse:

 

<div id="menu">   <h3>menu</h3>   <ul>	  <li><a href="#">menu1</a></li>	  <li><a href="#">menu2</a></li>	  <li><a href="#">menu3</a></li>   </ul></div>

Como eu tenho 4 TAGs (div, h3, ul, li), acho que dá pra colocar as 3 partes da figura que eu preciso. Queria saber se tem como usar apenas uma imagem pra formar este menu. Tipo assim (só uma idéia): na TAG h3 eu colocaria a parte de cima da imagem (tipo os primeiros 20px de altura, por exemplo). Na TAG do DIV eu colocaria a parte de baixo da imagem (sempre colocando a altura para saber qual parte da imagem estou usando. Acho que é assim). No centro, no caso o UL ou o LI (não sei qual seria o mais correto), eu colocaria a imagem do centro da figura do menu repetindo no eixo Y.

 

Acho que este é a idéia.

 

Já tentei aqui, mas não cheguei nem perto de conseguir um resultado satisfatório.

 

Será que alguém poderia me ajudar???

 

Desde já agradeço.

[Carlos Vital 0]

Oi tudo bem?

olha se isso te ajuda: http://forum.imasters.com.br/index.php?showtopic=211245

qualquer coisa poste ai. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[gguimaraes 0]

E aê Carlos, beleza?Cara, valeu pela ajuda. Como eu faço pra repetir uma parte central de uma imagem. O vídeo mostra como colocar duas partes da imagem (na caso de um botão), mas não mostra como fazer para colocar a parte do meio da imagem.Por mais que pareça simples (ou que seja), eu não estou conseguindo fazer. Já tentei colocar uma parte da imagem colocando a posição, altura e largura. Mas não deu certo.Você teria algum código de exemplo pra que eu pudesse dar uma olhada.Valeu!!