Как поправить неправильное отображение миниатюр?

Question

[leshajam]

С недавнего времени неправильно отображаются миниатюры, причем даже если вставляю изображения 150х150 пикселей, все равно картинка разъезжается https://aquamove.ru/pages/page/2. Приходится просто удалять. Как поправить? некоторые картинки норма вставляются.

Answer 1

[Roman]

Проблема в html (а именно в теге style в нем)

<style>
            img:is([sizes="auto" i], [sizes^="auto," i]) {
                contain-intrinsic-size: 3000px 1500px;
            }
</style>

PS Открой консоль разработчика ctrl+shitf+i и сам все увидишь, 21 строчка

Comments

[leshajam]

Roman, спасибо, а можете поподробнее расписать что где и как поменять надо? На других страницах теже значения - но отображается все нормально.

[Roman]

leshajam, измените это значение в ваших шаблонах на
contain-intrinsic-size: 300px 150px;

[Roman]

leshajam, Это свойство CSS используется для оптимизации отображения элементов при использовании CSS-свойства content-visibility: auto. Оно задаёт "предполагаемый" размер элемента до его полной загрузки, чтобы браузер мог корректно рассчитать макет страницы и избежать резких сдвигов контента (layout shift).