#html #css #overflow #border
#HTML #css #переполнение #граница
Вопрос:
У меня есть контейнер div с идентификатором container .
Внутри у меня есть div с идентификатором inside , который может содержать текст, который шире, чем div контейнера. Текст не должен быть обернут.
В качестве резюме, вот как это выглядит на самом деле:
_____DIV CONTAINER________________________
|'---DIV INSIDE--------------------------|----------------
|' | '
|' here it contains some long text which is very long '
|' | '
|'---------------------------------------|---------------'
|________________________________________|
Теперь я хочу, чтобы это выглядело так:
_____DIV CONTAINER________________________
|'---DIV INSIDE--------------------------|
|' |
|' here it contains some long text which |
|' |
|'---------------------------------------|
|________________________________________|
Вот так это должно выглядеть, и внизу должна отображаться горизонтальная полоса прокрутки.
Если я решу это, внутренний div покажет правую границу внутри контейнера, но текст будет продолжаться. Так что это случайно выглядит так:
_____DIV CONTAINER_____________________________
|'---DIV INSIDE------------------------' |
|' ' |
|' here it contains some long text whic'h look| [and here's the text under the container]
|' ' |
|'-------------------------------------- |
|_____________________________________________|
Как я только что видел, это должно выглядеть так, как здесь, в stack:
........................................................look at the border here | very long text very long text very long text very long text very long text very long text very long text very long text
Текст проходит под рамкой встроенного div, но не переносится. Это то, чего я хочу достичь. Как я могу это решить?
Комментарии:
1. Чего именно вы хотите? Я заблудился на вашей третьей картинке…
2. Я просто хочу не переносить текст, а текст, скрывающийся за контейнером-div (внешним)
3. вы пробовали
#container {overflow: scroll}в своем css?4. Это сработало, если я использую его внутри div! Спасибо 😉 не могли бы вы написать ответ, чтобы я мог пометить его как правильный?
Ответ №1:
Вы хотите установить свойство переполнения контейнера div для прокрутки:
#container {
overflow:scroll;
}
Ответ №2:
Я полагаю, вы хотите установить для своего родительского div значение overflow: scroll .
Комментарии:
1. Упс, J Max может опубликовать это как ответ. Я не видел его комментария, прежде чем ответить.
Ответ №3:
имейте 3-й div внутри «inside», который в вашем случае не имеет заданной ширины и допускает переполнение.
это будет означать, что содержимое внутри внутри переполнится, однако не изменит размер inside и его родительских разделов.
также два полезных правила css, которые, возможно, удобно применять к div внутри внутри:
overflow-x: auto;
overflow-y: hidden;
(это покажет только строку x).
Надеюсь, это поможет?