overflow ограничивает абсолютный блок

[BoJITyH]

Как сделать, чтобы абсолютный блок не обрезался внешним блоком с ограничением overflow:auto.

Структура такая:

<div style='overflow:auto; width:500px;'>
  <div style='position:relative'>
    <div style='position:absolute; width:1000px;'>
      длииииииииииииииииииинннннннннннннннннннннннныыыыыыыыыыыыыыыыыыйййййййййййййййййййй тееееееееееееееееккккккккккккссссссссссссттттттттт
    </div>
  </div>

</div>

Как сделать, что бы блок с текстом не обрезался внешним дивом с overflow, но при этом позиционировался относительно блока relative? 

z-index менял. В статичный блок абсолютный помещал.

[Igor Schnaider]

Цитата

The computed values of ‘overflow-x’ and ‘overflow-y’ are the same as their specified values, except that some combinations with ‘visible’ are not possible: if one is specified as ‘visible’ and the other is ‘scroll’ or ‘auto’, then ‘visible’ is set to ‘auto’.

Это из спеки. То есть, не получится.

[Launder]

Ну, на всякий случай, Вы в курсе, что итак работает? А вообще через padding-top можно.

[Launder]

Ну или min-height можно. Или вот так.

Edited April 3, 2016 by Launder

[Switch74]

А при чем тут height, если речь идет о width судя по всему?

[Launder]

4 часа назад, Switch74 сказал:

А при чем тут height, если речь идет о width судя по всему?

Можно так сделать...

[Switch74]

а что изменилось?

текст так и остается скрытым

[Launder]

49 минут назад, Switch74 сказал:

текст так и остается скрытым

Как это?

[Switch74]

мне почему-то кажется, что ТС не хочется крутить горизонтальную полосу прокрутки, чтобы увидеть весь текст из этого блока

[Launder]

1 час назад, Switch74 сказал:

мне почему-то кажется, что ТС не хочется крутить горизонтальную полосу прокрутки, чтобы увидеть весь текст из этого блока

Кхм, интересный поворот. Я исходил из того, что ТС просто не видит текст (собственно в песочнице его и не видно), поскольку блок relative у него пустой, а абсолютный блок сам по себе ничего не растягивает. Но если смотреть на блок relative как на нечто, что с одной стороны лежать в закрытом контейнере, но при этом позиционироваться не относительно этого контейнера, а относительно... странички?, то такая постановка задачи мне представляется несколько странной. Ведь смысл правил width: 500px и overflow: hidden в том и состоит, что всё, что не влезает в пределы 500 пикселей прокручивать. Если же ТС не хочет видеть полосы прокрутки, то зачем он эти правила назначал? В общем, если Вы что-то понимаете, чего я не понимаю, поясните, пожалуйста, а так вообще, хотелось бы какой-то более детальной иллюстрации, чтоб понимать что имелось в виду под "не обрезался", и каким образом планируется "позиционировать".

Мой последний пример с relative вместо absolute понятно что работает несколько по-другому, но в некоторых случаях, это может оказаться не существенным (в приведённом примере, похоже, это как раз не существенно), но так ли это в случае, в котором его планирует его использовать автор - неизвестно. Более того, если исходить из первоначальной информации (как я её понял), то, как я сразу и сказал, работает всё и без позиционирования.

[Switch74]

возможно вы и правы

[BoJITyH]

К сожалению проблема не в этом.
Сам по себе блок relative заполнен контентом и находится в длинном фиксированном блоке (для того ofverflow и сделано, что бы в этот блок влезал весь контент). Проматывать блок до конца далеко вниз, что бы промотать вправо, очень неудобно.

Сжать блок так же не получается, контент не позволяет. То есть абсолютный блок будет всегда шире фиксированного.

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

 

 

Edited April 4, 2016 by BoJITyH
мелкие косяки

[Igor Schnaider]

Вы бы хоть нарисовали, что хотите, а то и чтобы не перекрывал полосы, но при этом должен быть overflow: hidden? 

[BoJITyH]

Прикладываю картинку с тем, что хочу вообще получить