Так верстают только...

Ты действительно хочешь, чтобы все без объяснений полезли на этот сайт?

Могу то же самое сказать про имгур. У меня хотя бы прямой линк на картинку. Если так страшно зайди через тор/vpn с чистого профиля браузера

Мой ключевой тейк «без пояснений». А имя сайта усугубляет

Добавил пояснение. Я в любом случае сомневаюсь что что-то исправят

Как в каком браузере не меняя position такое получить?

Firefox андройдовый второй свежести

Firefox андройдовый второй свежести

Ну хорошо что сказал, а то в обычном ФФ и хроме все ок

О, я так и думал что где-то налажал, но не мог найти где. А что, нет возможности обновиться?

Я полез ради интереса, это просто нода мастодона.

Мастурбатедон, да, как Илон Маск завещал
https://www.snopes.com/fact-check/musk-tweet-mastodon-masterbatedone/

Практически нет. свежий firefox уж очень много весит. Андройду с a/b разделами слишком тесно на 64гб. servo тоже жирный. apk прсото не ставятся даже если пару гигов освободить, а больше пока не могу. Можно прошивку поменять на более компактную и с другой разметкой разделов, но честно говоря на настроенном много лет назад работающем устройстве этого делать совсем не хочется, всё с нуля придётся ставить.

Кстати, в pale moon проблема тоже есть, а он уже не такой старый

А что оно вообще должно было делать? У меня тег <a> содержащий ссылку идёт в полную ширину, а внутри position:absolute, без указания position в классе родительского элемента и без указания координат. Как это должно работать? Откуда пришло центрирование я правда не понял, скорее всего какой-то из родительских компонентов. Но картинка, у которой absolute в позиции не будет растягивать внешний контейнер, потому она и налазит на текст

Смена position:absolute на relative в теге картинки исправляет проблему для картинок в постах

Так должно выглядеть?

На глагне relative тоже помог
было
стало

После недавнего обновления

все как то мелко стало, раньше zoom был 125% - теперь 150%.

А что оно вообще должно было делать? У меня тег содержащий ссылку идёт в полную ширину, а внутри position:absolute, без указания position в классе родительского элемента и без указания координат. Как это должно работать?

Это старые извращения, в том плане что оно давно так устроено. Идея описана вот тут: https://codecaptain.io/blog/web-development/responsive-images-and-preventing-page-reflow/474

Я приделал еще скукоживание вертикальных изображений, чтобы их высота не превышала 90% видимой части окна браузера. И приделал туда центрирование.

Смена position:absolute на relative в теге картинки исправляет проблему для картинок в постах

Позже попробую, если никаких побочек не будет то поменяю. Но уже не сегодня.

Код по ссылке у меня отображается нормально, если не считать не загрузившейся картинки, плейсхолдер у неё правильного размера и сдвигает текст вниз. Там правда ситуация немного отличается: у картинки указано заполнение на 100%, а сама картинка располагается непосредственно в responsive-container, а не в дочернем <a>.
Я правда так и не совсем понял, как это работает, ведь position:absolute заставляет компонент не влиять на размеры контейнера. Может какие-то хитрые display меняют это поведение?
Если это действительно так задумано, а не какая-то неоднозначность css, возможно стоит баг в UXP зарепортить, но тогда надо чётко понять, почему оно развалилось и как именно должно было работать.
Я бы если подобный css писал - сделал бы у картинки relative т.к мне нужно чтобы размеры картинки установили высоту содержащих её контейнеров (href/div), а absolute это исключает, делая из контейнера просто якорь для просчёта позиции

P.S
https://developer.mozilla.org/en-US/docs/Web/CSS/min
Убрал его и заработало как надо без relative. В оригинальном примере никакого min нету.

Я правда так и не совсем понял, как это работает, ведь position:absolute заставляет компонент не влиять на размеры контейнера.

Ну так задумка в том, чтобы избежать сдвига контента при подгрузке изображения. По этому делается пустой div нужного размера, а картинка потом поверх него подгружается когда может.

Код по ссылке у меня отображается нормально

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

сли это действительно так задумано, а не какая-то неоднозначность css

Вот тут не знаю, я не на 100% понимаю как оно должно работать по спецификации.

Да нашёл уже. У меня css min не поддерживается в обоих браузерах В последней версии pale moon должно работать.
Можно вместо min() использовать min-height:90vh

А absolute там видимо намеренно сделан, чтобы контейнер не подстраивался под изображение, тогда всё логично, просто здесь высота контейнера счиатется нулевой и всё ломается

А точно дело в «min»? Вроде он с FF 75 должен работать, а это апрель 2020.

ну так не везде браузеры новее апреля 2020, я просто ставил тот, у которого apk был меньше
В pale moon был реализован несколько позже:
https://repo.palemoon.org/MoonchildProductions/UXP/issues/2230
но сейчас у меня временно более старая версия, т.к обходил один баг

мой дефолтовый прокруст.цсс всё равно всё по-моему перевёрстывает тщмт

Я нашел извратный способ, благодаря которому в свежем Pale Moon оно стало норм рендериться. Хотя блоки в dev tools выглядят подозрительно.

Проверь на своих устройствах plz.

Спасибо, всё починилось :)

https://masturbated.one/system/media_attachments/files/113/764/779/955/898/920/original/0505fffc03c33d4a.png

Очень хорошая иллюстрация работы с Calibre.

глагне по-прежнему сломана:
http://dimas000.ru/images/2025-005/lor1.png
http://dimas000.ru/images/2025-005/lor2.png
http://dimas000.ru/images/2025-005/lor3.png
до этого картинки вообще наезжали на текст, перекрывая его, зато теперь слева от них вагон пустого места, но в ширину все как было распахано, так оно и осталось. что интересно, даже включение "fit to width" не помогает, хотя обычно лечит даже самые упоротые говносайты((
cast !maxcom, верни все взад, как былО! нафига полез чинить то, что не сломано?

Попробуй не менять User Agent на свой.

Какой браузер?

Боюсь, что с 12й оперой починить совместимость всё же слишком сложно, это проще старые стили вернуть. А если переключить тему - лучше?

На скрине судя по всему presto

Какой браузер?

opera 12.xx

Боюсь, что с 12й оперой починить совместимость всё же слишком сложно

чего сложного-то? буквально несколько дней назад все работало. ломать не надо было, вот и вся сложность)))

А если переключить тему - лучше?

нет, на всех та же фигня.
запустил браузер с пустым профилем, чтоб без всяких юзерстилей и прочего, - то же самое, картинки все равно в экран не влезают. (зато баннер на глагне увидел - тут я вообще офигел! на лоре есть реклама??)

эээ, че-то последнее сообщение не могу редактировать почему-то... че за прикол?
короче, докладываю: Qupzilla (кто это вообще?) Application version 1.6.6 WebKit version 537.21 - ровно та же картина.
чуть позже попробую Netsurf на другой системе, там посвежее говно мамонта))

Как я понимаю, все эти браузеры даже css3 не умеют полноценно
Да на самом деле переписать этот стиль под старые css вполне можно. Только вот кто этим заниматься будет? Возможно, есть смысл сделать fallback-стиль с какими-то приемлимыми параметрами

буквально несколько дней назад все работало. ломать не надо было, вот и вся сложность

Я доделываю один долгострой с картинками, его не видно, потому что он еще не готов. Изменения в CSS по большей части с этим связаны.

докладываю: в netsurf та жа фигня, картинки выезжают за край экрана. хоть текст уже не перекрывают, и на том спасибо))
только в хромоногом все работает, как задумано

Как я понимаю, все эти браузеры даже css3 не умеют полноценно

а должны? блин, это же лор, он всегда славился тем, что работал везде и на всем! не надо тащить сюда смузи-технологии!
тупой и примитивный align: float (или как там оно) на самом <img> сто лет как работает, нафига все эти пляски с "ехал div через div"?

я-то для себя вылечил:
div.medium-image-container {
display: none !important;
}
тем более, что там одну фигню пихают в эти картинки, но все равно обидно.
ладно опера, депрекатед там, все дела, но уж пользователей netsurf в некрофилии-то сложно обвинить!
(а я, блин, виноват, что нормальных браузеров больше не осталось?)

Я не знаю почему он там разъезжается. Исследуй и расскажи, что именно привело к такому эффекту.