Resmin Alt Köşesine İkon ekleme

arkadaşlar yeni bir film sitesi tasarımına başladım (ilk tasarımım olacak nasipse). Şimdilik hazır bir templateyi düzenliyorum sonrasında wp aktaracağım. Benim küçük bir sorum olacaktı sizlere. Alttaki resimlerde işaretlediğim kırmızı yerlere imdb puanı eklemek istiyorum mesela resimlerin üst köşesinde bulunan altyazı resmi gibi bir resim oraya ayarlayıp üzerine imdb puanı yazdıracağım bunu nasıl yapabilirim acaba?

Resmi div içine al, div'e position: relative; ver. Kapsayıcı olacak o div. Bir de içindeki resim kodundan sonra span tagı kullan, içine imdb puanını yaz. Sonra span'a position: absolute; ver. right: 5px; bottom: 5px; değerlerini ver. Bu kadar. :)

css sizin dediklerinizi yapınca şu şekilde oldu.

.imdb {
position: relative;
}

span{
position: absolute;
right: 5px;
bottom: 5px;
}

.film img{
border-width: 0;
margin-top: 0;
margin-bottom: 0;
width:170px;
height:255px;
}
.product_box {
float: left;
width: 170px;
text-align: center;
margin: -25px 10px 30px 5px;
}

.product_box img {
margin-bottom: 10px;
}

kodlar ise bunlar



sonuç sıfır bişi olmadı saçma sapan şekil aldı :)

Ek Olarak:

hocam şimdi olur gibi oldu her şey geldi bir imdb remi gelmedi
şu şekilde

kodlar ise bu şekilde

.product_box .imdb {
position: relative;
background: url(images/imdb.png);
font-weight: bold;

}

span{
position: absolute;
right: 5px;
bottom: 25px;
}


html kodu da bu

IMDB resmiyle birlikte tasarımı PM atar mısın? Daha önce çalışmıştık. Bu sefer ücretsiz yardımcı olmak isterim.

Ek Olarak: Gönderdim dosyayı.