Егор Живагин: 1) Не понял, какую строчку закомментировать в твоем примере? )
2) А почему второй способ древний? Я вчера как раз смотрел много примеров слайдеров на сайтах и много где замечал так делают, только img почему то абсолютом делают.
3) Думаешь флекс уже можно 100% задействовать? )
Егор Живагин: А как можно картинку отцентровать, если часть скрыта справа. Т.е. картинка по умолчанию как я понял прижимается к левой части экрана и то что справа уже не видно на мобильном, так как overflow: hidden.
Вот пример если картинка 1920х500 px
img {
height: 300px;
overflow: hidden
}
На экране мобильно видно будет только левую часть картинки, как можно сделать чтобы было видно центральную часть картинки?
Просто в случае через background, там можно выровнять с помощью: center top no-repeat. А вот как быть с <img>, как его выравнивать? )
Ну да, работают почти одинаково, но у cover есть плюс! Когда ширина изображения меньше высоты (на мобильных к примеру), он не уменьшает высоту пропорционально, а начинает скрывать часть картинки по ширине. А с max-width: 100% , картинка начинает уменьшаться по высоте.
Егор Живагин: да, поддержка не очень. А как по другому можно сделать. У меня слайдер на всю ширину, а высотой к примеру 500px . Надо как то сделать чтобы картинка подстраивалась под эту высоту. Если через background, то да, можно применить background-size: cover.
А если через тег img делать, то как ещё можно? )
Алексей: Ок, я понял, а можно как то покороче написать или только так. Впринципе выводит, так как я хотел: https://prnt.sc/g9jruz
Можно это как то упростить?
