← WordPress

Como sobrepor 2 imagens nos meus posts?

Lida 4006 vezes

Offline
r

ragnarock 
Membro
Mensagens 208 Gostos 1
Feedback +1

Troféus totais: 27
Trófeus: (Ver todos)
Tenth year Anniversary Nineth year Anniversary Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2

Gostava de sobrepor 2 imagens com as mesmas dimensões no excerto dos meus posts.

Já andei a ler (aqui)e parece que dá para fazer com css usando a tag z-index, acontece que pelos vistos temos de usar uma posição absoluta, e eu quero que quando liste todos os exertos dos posts veja em cada um deles as imagens sobrepostas como deve ser, sem tar tudo na mesma zona.

é possível fazer isto?
Offline

Gonçalo Martins 
Membro
Mensagens 229 Gostos 0
Troféus totais: 26
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1

1º
<div style="position:relative;width:100px;height:100px">  <!--CONTENTOR DAS IMAGENS-->
<img style="width:100px;height:100px;z-index:2;position:absolute;">
<img style="width:100px;height:100px;z-index:1">
</div>

2º
<div style="position:relative;width:100px;height:100px">   <!--CONTENTOR DAS IMAGENS-->
<div style="width:100px;height:100px;z-index:2;position:absolute;background:url(...) no-repeat;">
<div style="width:100px;height:100px;z-index:1;background:url(...) no-repeat;">
</div>

utiliza margin-left em vez e left e margin-top em vez de top ao inves do css que apresentaste do topico e link que colocaste
Offline
r

ragnarock 
Membro
Mensagens 208 Gostos 1
Feedback +1

Troféus totais: 27
Trófeus: (Ver todos)
Tenth year Anniversary Nineth year Anniversary Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2

não sei se percebi tudo como deve ser...
Fiz um teste a martelo com este código:

<div style="position:relative;width:215px;height:215px">   <!--CONTENTOR DAS IMAGENS-->
<div style="width:215px;height:215px;z-index:2;position:absolute;background:url('http://www.jogosbaratos.net/images/bg2.png') no-repeat;">
<div style="width:215px;height:215px;z-index:1;background:url('http://www.jogosbaratos.net/images/bg1.png') no-repeat;">
</div>

mas o resultado foi este

só fiz um post com isso pra testar e estragou-me logo tudo, apaguei o post e ficou tudo ok de novo.

Ainda sou muito verdinho nisto da web, alguém me consegue explicar o que se passou? é que sem ser no blog (ou seja num html local) parece que funciona bem

cumps

Páginas: 1

Posts relacionados

HTML + CSS

[CSS] Como sobrepor um DIV a uma imagem alinhado ao fundo dessa imagem?

muiomuio

WordPress

[Ajuda] Inserir imagens nos posts

Luís Torres

Sugestões

Não consigo pôr a opção BIN nos meus leilões

S
Spacecowboy