Úplne som odstránil prvok obrázka a nastavil som ho ako pozadie div s triedou .frame
Toto funguje dobre aspoň v prehliadačoch Internet Explorer 8, Firefox 6 a Chrome 13.
Skontroloval som to a toto riešenie nebude fungovať na zmenšenie obrázkov väčších ako 25 pixelov na výšku. Existuje vlastnosť s názvom background-size, ktorá síce nastavuje veľkosť prvku, ale je to CSS 3, čo by bolo v rozpore s požiadavkami Internet Explorer 7.
Poradil by som vám, aby ste buď prepracovali priority prehliadača a navrhli dizajn pre najlepšie dostupné prehliadače, alebo si zaobstarali nejaký kód na strane servera na zmenu veľkosti obrázkov, ak by ste chceli použiť toto riešenie.
Je veľmi dôležité, aby ste buď dali obrázkom triedu, alebo použili dedičnosť na zameranie obrázkov, ktoré potrebujete vycentrovať. V tomto príklade sme použili .frame img {}, aby sa zamerali len obrázky obalené divom s triedou .frame.