Posicionar classes de diferentes tamanhos

[ericolvr 0]

Bom dia,

Estava pensando em fazer algo como essa galeria de imagens dos CD's do sonora:

 

terra sonora

 

Algúem imagina como pode ter sido feita?

 

Grato

[Paulo de Tarso F. M. 24]

Encontrei isso no CSS:

.mosaicView .generic_list li.hover .image {
    position:absolute;
    top:-3px;
    left:-3px;
    width:102%;
    height:102%;
    border:2px solid #f90;
}

Essa é a formatação aplicada às imagens quando o mouse está sobre as mesmas (observe até que eles nem estão utilizando a pseudo-classe :hover, pelo menos não a identifiquei no CSS...).

 

Uma dica: não sei se você conhece o Firebug, se não o conhece, vale a pena dar uma conferida pois foi com ele que consegui encontrar esse código acima...

 

http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

[ericolvr 0]

Opa Paulo,

obrigado, me pareceu tão complexo que nem me dei ao trabalho de ver o "fonte".

Desculpe o atraso na resposta, mas graças aos bons serviços prestados pela telefonica fiquei sem speedy vários dias.

 

Vou tentar montar algo aqui e compartilho as dúvidas.

 

Abraços

Érico Oliveira

[Evandro Oliveira 331]

Encontrei isso no CSS:

.mosaicView .generic_list li.hover .image {
    position:absolute;
    top:-3px;
    left:-3px;
    width:102%;
    height:102%;
    border:2px solid #f90;
}

Essa é a formatação aplicada às imagens quando o mouse está sobre as mesmas (observe até que eles nem estão utilizando a pseudo-classe :hover, pelo menos não a identifiquei no CSS...).

 

Uma dica: não sei se você conhece o Firebug, se não o conhece, vale a pena dar uma conferida pois foi com ele que consegui encontrar esse código acima...

 

http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

 

 

o :hover virou a classe .hover, provavelmente aplicada com Javascript (compatibilidade com IE, eles não conhecem o csshover ^^).