Jump to content
  • 0

Не работает overflow


xmlns
 Share

Question

Добрый день.

Есть фиксированный div, растянутый на весь экран (аля модальное окно). А на нем есть таблица. Она может быть совершенно разного размера как в высоту, так и в ширину, и в том числе быть больше окна браузера. Подскажите, как правильно сверстать, чтобы появился горизонтальный скрол, если она не помещается в ширину?

Вот в высоту почему-то все работает нормально, а в ширину - нет (таблица начинает ужимать ячейки, чтобы вместиться). Фиксированному диву я поставил

overflow: auto

Может там еще какой контейнер-обертку надо... Или в css какое свойство задать?

Link to comment
Share on other sites

9 answers to this question

Recommended Posts

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By Curt54rus
      Есть страничка по адресу http://sale.srfhm.ru/css_bug/
      В ней есть табличка сделанная на UL LI тегах, и вот в ячейке Описание, где выводится описание для типа питания не влезает весь текст и остальную часть не видно, скрывается стилем - overflow: hidden
       
      Пробовал убрать этот overflow, тогда вообще таблица вся разъезжается... 
       
      В верстке не особо силен, подскажите пожалуйста где поправить что, чтобы текст нормально влез и весь отображался... Пробовал уже по всякому, всю голову сломал!
       
      Заранее огромное Спасибо!
    • By yaparoff
      Нужно чтобы текст обрезался по вертикали http://skrinshoter.ru/s/040718/dYPUy6EU
      и переполненное содержимое скрывалось
      overflow: hidden почему то не помогает
      https://codepen.io/anon/pen/yErxLY
    • By ows.nightwolf
      Всем доброго времени суток
      У меня возникла проблема с overflow. Вот упрощенный пример, для того чтоб "потрогать" проблему. В этом примере есть контейнер, и в нем абсолютно позиционированный элемент. Контейнеру заданы свойства overflow-x: hidden и overflow-y: visible для того чтобы все что вылазит за пределы контейнера по оси X скрывалось, а все что вылазит по оси Y - показывалось, при этом скролл на компоненте отображаться не должен. Но эта связка не работает (как видно на примере - у контейнера появляется скролл бар), однако если у контейнера изменить overflow-x c hidden на visible все работает как надо - скролл бар пропадает и абсолютно позиционированный элемент становится полностью видим, вылазя за пределы контейнера.
      Вопрос: почему браузеру есть разница установлен ли overflow-x в visible если контент внутри карусели выходит за пределы карусели по оси Y, а не X, и как решить эту проблему?
    • By Launder
      Столкнулся со следующим странным поведением.
      В хроме пока работает transition, фон просвечивает через border-radius (наведите на первый пункт).
      В Лисе градиент имеют такую особенность: полосочка 10px, полосочка 10px, прозрачность, на стыке второй полосочки и прозрачности образуется некий серый фон толщиной пикселя в два. Поскольку фон в примере двухнаправленный, то Вы, убрав одно направление (65 или 66 строчка, не забудте в конце оставленной строчки поставить точку с запятой ), можете увидеть что полоска есть только в том направлении, где нулевой переход из цвета в прозрачность.
      По обеим глюкам: что это? откуда это? куда писать? какие способы бороться?
      Спасибо за внимание
    • By uniken1
      https://jsfiddle.net/6on27wxf/
      Вот такой простой пример. При использовании стиля overflow: hidden; у родительского div увеличивается высота и снизу появляется серая полоса. Если overflow убрать то все нормально. Как сделать overflow: hidden и сохранить высоту?
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy