CSS ile Resmi Üstten ve Alttan Ortalamak

Css 2.0 ile resmimizi alttan ve üstten ortalamak ne kadar zor görünse de aslında o kadar zor değil. birkaç tane iç içe div ile bunu halledebiliriz.  Aşağıda css ve html kodlarını bulabilir ve örnek uygulamayı görebilirsiniz.
 
CSS Kodlarımız :

.anatablo{width:500px;height: 250px;display: table;#position: relative; overflow: hidden;text-align:center;margin:0 auto;border:solid 2px #000}
.anatablo .ictablo{#position: absolute; #top: 50%;#left:50%;display: table-cell; vertical-align: middle;border:solid 2px #000}
.anatablo .ictablo .resim{max-width:300px;max-height:150px;#position: relative; #top: -50%;#left:-50%;border:solid 2px #000}

Not : # ile başlayan css kodları sadece internet explorer’da görünür. ie de sorunsuz çalışması için bu kodlarda gerekli.
 
Html Kodlarımız

<div class="anatablo">
<div class="ictablo"><img class="icerik" src="http://eyurtsever.com/logo.png" alt="eyurtsever.com" /></div>
</div>

Çalışan Uygulamayı görmek için tıklayınız

Continue Reading