Как растянуть картинку только по ширине?

[verfaa]

Есть картинка размером 89х89 px.
Мне нужно растянуть эту картинку по ширине до 193px, но чтобы высота осталась оригинальной - 89px.

Пробовал в стилях указывать

width: 193px;

Но картинка тогда растягивается и по высоте на 193px.

Пробовал указать

width: 193px; height: 100%;

Тоже не помогает...

Сама картинка находится внутри блока div

<div class="span2">

может с ним как-то поколдовать?

Подскажите как сделать, может на крайний случай с помощью jquery как-то реализовать?

 

[ZOLK]

width: 193px; height: 89px;
Так пробовал?

Картинка как img или фон дива?

 

[polyetilen]

.span2 img {width:193px;}

 

[verfaa]

Для просмотра ссылки Войди или Зарегистрируйся пробовал
Для просмотра ссылки Войди или Зарегистрируйся, забыл написать, там картинок много и они все разной высоты - нужно все растянуть по ширине на 193px, а высота должна уменьшаться пропорционально, так что указать прямо height: 89px не получится

Картинка как img

 

[polyetilen]

тогда так
.span2 img {min-width:193px;max-width:193px;}
но если было 89x89 то высота увеличится пропорционально и тоже будет 193px
а если слишком высокие то прятать остаток картинки в диве
.span2 {height:89px;overflow:hidden;}

 

[BDSG]

span img{
    width: inherit; /* наследуем ширину от родительского контейнера */
    height: auto; /* высота задаётся пропорционально */
}

ну а шириной уже в самом span задаётся..

 

[Agnet]

.content img {max-width:193px; height:auto;}
а вообще я советую масштабировать не в пикселах а в %
например
.content img {mac-width:216%; height:auto;}

 

[n3kask]

.content img {max-width:193px; height:auto;}
а вообще я советую масштабировать не в пикселах а в %
например
.content img {max-width:216%; height:auto;}

Опечатка

 

[Jado]

Если картинок много, и они все они разной высоты, то масштабирование всё равно будет кривым, хотя бы вертикали колонки.
Я бы поступил так, в угоду красоте:

1. Пакетно перегнать всё под размер в faststone photo resizer.
2. И задать жёстко размер.

Но, вариант через css с максимальной шириной, самый подходящий по времени.

 

[Wounderer]

Ужас какой... На JS не получится ?
Вариант, с применением jQuery :

$('img.resizeClass').each(function() { $(this).css({width:'100%', height:$(this).height()}); });

Для просмотра ссылки Войди или Зарегистрируйся

Соответственно выполнять после картинок в коде...