CSS colocando uma imagem em cima de outra
Eu estou trabalhando no modelo de design CSS.
Eu tenho duas imagensimageOne
eimageTwo
.
Ambos sãoposition: relative
porque se eu definir um delesposition: absolute
então ele não fica mais responsivo e a responsividade é a chave aqui.
O que eu quero é colocarimageTwo
Em cima deimageOne
.
Como posso conseguir isso enquanto o recurso responsivo do twitterbootstrap ainda funciona nessas duas imagens?
Abaixo está o meu código: (jsfiddle availableAqui)
<div class="imageOne image"></div>
<div class="imageTwo image"></div>
CSS
.image {
position: relative;
width: 100px;
height: 100px;
border: 1px solid red;
}
.imageOne {
z-index: 0;
}
.imageTwo {
z-index: 1;
}