Krakozavr
Member | Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору Mavrikii Спасибо! Не предполагал, что это тоже штатный дескриптоп CSS. То, что нужно! Заработало, но увы - наполовину На сайте две раскладки: десктопная и мобильная. Я включил нужные определения в имеющиеся свои кастомные блоки типа Код: @media only screen and (max-height:ХХХpx){...} | В десктопной версии всё отлично. А вот в мобильной, которая на первый взгляд ничем не отличается, не работает. Я перерыл инспектор и, кажется, лoкализовал проблему: Код: #slideshowWrapper.mobile-gallery #slideshow .slide img { position: static !important; height: auto !important; width: 100% !important; | Этот системный код является родительским по отношению к искомому. В результате похоже, что кастомный код не перекрывает инструкции, помеченные как !important. Если в инспекторе отключаешь код height: auto !important; или просто затираешт !important, оставляя только auto - кастомный код начинает работать. Я пробовал в кастомном CSS добавлять, в надежде переопределить !important на более мягкий вариант, конструкцию: Код: #slideshowWrapper.mobile-gallery #slideshow .slide img {height: auto;} [data-slide-url="gallery-description"] img {height: 400px !important;} | но это не работает, хотя по описанию астомный код с !important должен быт приоритетным. Можно ли это как-то побороть? P.S. Простите за путанку с темой, я не предполагал что это можно решить штатно через CSS - квалификации не хватает, я все-таки простой фотограф Очень сомневался, в какую тему можно это отнести. P.P.S. Чтобы было понятнее, чего добиваюсь -ссылка на применение. https://alex-potemkin.squarespace.com/ сайт на триале, надо нажать кнопку и ввести код для входа, уж простите Собственно, субъект масшитабирования - белая подложка под описанием. Проблема в том, что шаблон галереи не предусматривает такого блока вовсе, а мне он нужен. Я его создал хитрым хаком: загрузил белую картинку и дал ей в админке описание. Это описание выводится в специально размеченном DIV, свойства которого можно задать через CSS, а положение жестко привязано к картинке. Более того, в принципе работает адаптивный дизайн - галерея и текст масштабируются взависимости от разрешения дисплея, я там кое-что еще подкрутил и теперь почти хорошо. Но не совсем. Проблема в том, что картинка масштабируется пропорционально. И соответственно приходится "пропорционально" масштабировать текст. И именно на раскладках для мобильных девайсов это создает большую проблему. Эта раскладка имеет другую структуру - изображения в галерее выстраиваются в вертикальную ленту, масштабируясь по ширине экрана. И тогда картинка-подкладка становится слишком высокой, с огромным белым пространством, которое приходится заполнять слишком крупным текстом, а сама галерея вообще выдавливается за край экрана. | Всего записей: 320 | Зарегистр. 02-02-2003 | Отправлено: 23:28 12-04-2016 | Исправлено: Krakozavr, 23:40 12-04-2016 |
|