Свойство overflow-x решает, нужно ли обрезать содержимое с левой и правой стороны, если оно превышает доступную ширину элемента – ведь иногда хочется, чтобы текст «выходил» за рамки, а иногда надо держать всё аккуратно в пределах блока. | Значение по умолчанию: | visible |
|---|
| Наследуется: | нет |
|---|
| Версия: | CSS3 |
|---|
| Синтаксис JavaScript: | object.style.overflowX="scroll" |
|---|
| Значение | Описание |
|---|
| visible | Содержимое будет просто «выходить» за пределы блока – никаких обрезок, только свобода. | | hidden | Если часть контента не помещается, она отсекается и становится невидимой – всё остаётся в рамках. | | scroll | Контент обрезается, но вы сможете прокрутить его с помощью полосы - удобный способ держать всё под контролем. | | auto | При переполнении автоматически добавляются полосы прокрутки – не нужно прописывать их вручную. | | no-display | Если содержимое не помещается, весь блок с ним исчезает - как будто он никогда и не существовал. | | no-content | Контент просто не отображается, но сам блок остаётся в месте – идеальный вариант для скрытия лишнего. |
Пример
|