Div içindeki resmi ortalama

Arkadaşlar öncelikle belirteyim css ile pek fazla bir ilgim yok

Aşağıdaki css koduna göre resmin yarısı gözüküyor. 4 tarafdanda küçülterek ortalamasını nasıl sağlayabilirim?

Orijinal resim: http://www.torrentoyunindir.com/afis/ac3tyranny.jpg

Css çıktısına göre sitede gözüken şekli: https://i.hizliresim.com/xY624z.jpg

.laba_info .lcol {
    width: 340px;
    height: 220px;
    position: relative;
   -webkit-box-shadow: inset 0px 0px 0px 1px rgba(232, 232, 232, 1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(232, 232, 232, 1);
    box-shadow: inset 0px 0px 0px 1px rgba(232, 232, 232, 1);
    border: 5px solid #ccc;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
   }

.laba_info .lcol img { max-width:340px; width:340px; height:auto; }

bu css değerini ekleyerek genişliğe göre orantılı küçülte bilirsiniz yükseklik olarak orantılasın derseniz;

.laba_info .lcol img { max-height:220px; height:220px; width:auto; }

bu şekilde deneyebilirsiniz.


max-height değeri ile denedim localde sorunsuz bir şekilde ortaladı kaynak kodları

<style>
.laba_info .lcol {
    width: 340px;
    height: 220px;
    position: relative;
   -webkit-box-shadow: inset 0px 0px 0px 1px rgba(232, 232, 232, 1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(232, 232, 232, 1);
    box-shadow: inset 0px 0px 0px 1px rgba(232, 232, 232, 1);
    border: 5px solid #ccc;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px; text-align:center;
   }
 .laba_info .lcol img { max-height:220px; height:220px; width:auto; }</style>


<div class="laba_info">
<div class="lcol">
<img src="http://www.torrentoyunindir.com/afis/ac3tyranny.jpg" />
</div>
</div>

çok çok sağol dostum .laba_info .lcol img { height:240px; width:350px; } yapınca mükemmel oldu

lanet olası resim explorer de gözükmüyor :

site adresini iletir misin?

http://localhost/film2/izle.php?id=46

Localde çalışıyorum ama ie ızdırabından kurtuldum