Javascript-форум - Визуально обрезать изображение сверху и снизу и ценрировать растянув по ширине блока.

Не понимаю как сделать всё красиво.
Делаю так:

Код:

.block_short_img_box {

        overflow:hidden;

        width: 100%;

        height: 350px;

        border-radius: 2px 2px 0px 0px;

}



.block_short_img_box img {

    position: relative;

    top: -17%;

    width: 100% !important;

}

Когда изображение большое всё нормально, оно пропорционально обрезается. Но если оно маленькое то оно растягивается пропорционально ширине но вот потом остается огромный отступ снизу изображения, просто белое поле.

Может можно как то с помощью скриптов решить проблему центрирования и растягивания.

Нужно в общем что бы если изображение 870x460 или больше то просто сверху и снизу обрезалось и центрировалось, а если например 500x200 то оно растягивалось до размеров 870x460 и не обрезалось, а просто было по размеру блока.

Уже голова болит, не могу понять как так сделать!