CSS umieszczenie jednego obrazu na innym

Pracuję nad szablonem projektu CSS.

Mam dwa obrazyimageOne iimageTwo.

Oba sąposition: relative bo jeśli ustawię jedną z nichposition: absolute wtedy nie jest już tak responsywny, a kluczem jest tu szybkość reakcji.

Chcę umieścićimageTwo na górzeimageOne.

Jak mogę to osiągnąć, gdy funkcja responsywna twitterbootstrap nadal działa na tych dwóch obrazach?

Poniżej znajduje się mój kod: (dostępny jsfiddletutaj)

<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;
}

questionAnswers(7)

yourAnswerToTheQuestion