Растянуть картинку

[kolhoz]

Привет.. Есть блок в котором выводится статичная картинка с размерами 1300х800px. ширину картинки указал 100% чтобы растягивалась на всю ширину экрана. На на экране размерами 1920х1080 картинка по высоте не влезает вся. небольшой кусок внизу остается за рамками видимости экрана и нужно прокрутить вниз. Можно ли сделать чтобы при любых разрешениях экрана картинка по высоте всегда была видна? И.е. чтобы вся картинка вмещалась?

[satantx]

Как вариант сделать картинку бэкграундом с параметрами 

background-size: cover;

[kolhoz]

В этом случае нужно высоту блока задать фиксированно. А я бы не хотел так

[antonKar]

В этом случае нужно высоту блока задать фиксированно

И давно оно так требуется?

[kolhoz]

Дело в том что у меня вот такой код:

<div class="slideimg row">	<ul>	<li class="hidden_desktop"><img src="//intechsoft.ru.images.1c-bitrix-cdn.ru/bitrix/templates/landtmpl/img/slideimgbg.png?1425622588644067"></li>	</ul></div>

hidden_desktop - это для компьютеров

 

Сейчас я просто вывожу эту картинку указав ее ширину 100%. Но на экранах с разрешением 1920х1080 картинка видна не вся по высоте. Заказчик хочет, чтобы отображалась вся.

 

Вы говорите сделать бэкграундом с применением background-size: cover. Но в этом случае li остается пустым и нужно задать ему высоту. 

[satantx]

Сделайте li абсолютным и растяните на 100% в высоту и ширину

[user]

Можно так.

https://developers.google.com/web/fundamentals/layouts/rwd-fundamentals/use-media-queries?hl=ru

[kolhoz]

Пробовал сделать <li class="hidden_desktop"></li> абсолютным, задать ширину, высоту 100%. Не помогло. Вот сайт http://kursy05.ru/landing/

 

там есть участок кода

<div class="slideimg row">		<ul>			<li class="hidden_desktop"></li>			<li class="hidden_mobile"><img src="//intechsoft.ru.images.1c-bitrix-cdn.ru/bitrix/templates/landtmpl/img/1.png?1426224634324848"><img src="//intechsoft.ru.images.1c-bitrix-cdn.ru/bitrix/templates/landtmpl/img/3.png?142622463471152"><img src="//intechsoft.ru.images.1c-bitrix-cdn.ru/bitrix/templates/landtmpl/img/2.png?1426224635334370"></li>		</ul>	</div>