Добрый день!   Уважаемые специалисты, помогите, пожалуйста, с масштабированием картинок, у меня никак не получается сделать ровно для всех браузеров.   Имеется вордпресс, в теме есть галерея с горизонтальной "прокруткой".   У меня было желание настроить галерею более грамотно и удобно. Изначально галерея предполагает загрузку картинок одной высоты, но мне это не подходит. У меня вертикальные и горизонтальные фотографии, и мне нужно, чтобы они были одной высоты в галерее, при этом, чтобы вертикальные масштабировались под высоту горизонтальных.   В оригинале выглядит вот так:   http://demo.megathe.me/heat/portfolio/people/   Код стиля: /* =iosSlider----------------------------------------------- */.container {	position: relative;	width: 100%;	height: auto;	margin: 0 auto;	overflow: visible;}.container .iosSliderContainer {	position: relative;	top: 0;	left: 0;	width: 100%;	height: auto;	margin: 0 0 0 0;	overflow: visible;}.iosSlider {	position: relative;	top: 0;	left: 0;	overflow: visible;	width: 100%;	height: auto;}.iosSlider .slider {	width: 50000px;	height: 100%;}.iosSlider .slider .item {	float: left;	width: auto;}.iosSlider .slider .item img {	width: 100%;	height: auto;	float: left;}На моём сайте вот так:   http://www.radosvet.ru/portfolio/margarita-portret/   Код я немного изменил, добавив max-height: 600px: /* =iosSlider max-height: 600px;----------------------------------------------- */.container {	position: relative;	width: 100%;	height: auto;	margin: 0 auto;	overflow: visible;	max-height: 600px;}.container .iosSliderContainer {	position: relative;	top: 0;	left: 0;	width: 100%;	height: auto;	margin: 0 0 0 0;	overflow: visible;	max-height: 600px;}.iosSlider {	position: relative;	top: 0;	left: 0;	overflow: visible;	width: 100%;	height: auto;	max-height: 600px;}.iosSlider .slider {	width: 50000px;	height: 100%;}.iosSlider .slider .item {	float: left;	width: auto;max-height: 600px;}.iosSlider .slider .item img {	width: auto;	height: auto;	float: left;	max-height: 600px;	max-width: 100%;}В итоге вроде получилось то что мне нужно, но проблема в том, что при уменьшении окна вертикльные кадры "обрезаются" снизу.   Я ещё дописал, добавив     min-height: 600px;: ----------------------------------------------- */.container {	position: relative;	width: 100%;	height: auto;	margin: 0 auto;	overflow: visible;	max-height: 600px;	min-height: 600px;}.container .iosSliderContainer {	position: relative;	top: 0;	left: 0;	width: 100%;	height: auto;	margin: 0 0 0 0;	overflow: visible;	max-height: 600px;	min-height: 600px;}.iosSlider {	position: relative;	top: 0;	left: 0;	overflow: visible;	width: 100%;	height: auto;	max-height: 600px;	min-height: 600px;}.iosSlider .slider {	width: 50000px;	height: 100%;}.iosSlider .slider .item {	float: left;	width: auto;max-height: 600px;}.iosSlider .slider .item img {	width: auto;	height: auto;	float: left;	max-height: 600px;	max-width: 100%;}Теперь почти всё так, как мне нравится. Но параметр максимальной высоты не позволяет адаптивному дизайну быть на 100% рабочим. Например, при сужении окна по высоте картинка на экран не помещается. А в мобильных браузерах вообще всё как-то странно смотрится  В Firefox android при пролистывании далее картинки уменьшились, в Хроме просто лента из картинок вниз (хотя этотвариант меня устраивает).   Я бы хотел, чтобы всё это было красиво на всех устройствах, но не знаю как настроить контейнер и картинки. Помогите, пожалуйста, что можно добавить или изменить?