Неадекватный overflow, остановите его кто-нибудь!!!?

Question

[fred55rus]

Вобщем вот вся проблема: мне нужно скрыть все элементы, выходящие за рамки по Y, но при этом нужно сделать вылазиющий элемент по X, но если выставит overflow-y:hidden, то overflow-x наотрез отказывается быть каким-либо угодно, кроме как auto, даже если явно ему указать на visible.
Это недоработка в css такая или я туплю? Какой можно костыль придумать?
Расклад такой: https://jsfiddle.net/9cvr6x23/6/ --- Зелёный блок должен на 20пх выступать за рамки красного.

Answer 1

[Ivan Bogachev]

Читаем что говорят W3C, добавляем к этому особенности некоторых браузеров и получаем, что если вы применяете overflow visible к одной координате (x/y) и какой-либо другой overflow к другой, то в результате overflow visible превращается в auto. Это не "недоработка в css" - это стандарт. А "костыль" - это еще один контейнер (т.е. у родителя можно делать overflow-x: visible, а у дочернего элемента - overflow-y: hidden)

Comments

[fred55rus]

у меня выпирающий элемент однозначно должен быть последним во вложении, то есть он в любом случае попадает под влияние блока с hidden

Answer 2

[fred55rus]

Решение Ивана, по-моему, не подходит, ибо проблема поглубже.
Это у меня слайдер родительский элемент - это слайд, в котором и нужно разместить дочку, выезжающую за края. Все слайды находятся в контейнере, а контейнер находится в блоке с overflow.
Дак вот, этот выезжающий элемент должен быть разным на каждом слайде, то есть он должен крепиться исключительно к блоку со слайдом, иначе множество этих элементов просто сбивается в кучу.