Ambiera ForumDiscussions, Help and Support. |
|
|
|||||
|
How do I keep my text inside a container so that it will automatically go onto a new line when it would go out of the container instead of keeping going and creating a scroll bar and going off the screen? Being able to to this seems integral to my website working on a variety of devices but otherwise I'd just have to plan everything for the smallest resolution. |
||||
|
That's what containers are doing by default: They get bigger when you add more text or text wraps automatically when it doesn't fit into the width of the container. So that they work nicely on all screen sizes. What you are describing sounds strange. Could you describe a bit more what you are doing exactly? Or post a screenshot? |
||||
|
https://drive.google.com/file/d/... Here's a screenshot of what I mean. Currently the container is set to a specific size but when it's on auto the text just cotinues endlessly creating the scroll bar. What I want to happen is for the text to automatically drop to a new line rather than going off the page. Excuse the horrible website, I'm just messing around with features using random images I had saved at the moment. |
||||
|
Sorry figured it out. The issues was just using along string of characters. It will break up actual words in paragraphs as long as there are spaces. |
||||
|
Ah, nice :) I think there is a way to force them to break up as well, there is some CSS style for that if you need it. |
||||
|
I have that problem with long URLs when viewing in cellphone portait mode. They do not wrap and URL text goes out of container, but I never see scroll bars. |
||||
|
avery wrote: "I have that problem with long URLs when viewing in cellphone portait mode. They do not wrap and URL text goes out of container ..." You can easily fix that: Don't write the URL itself, but a short and meaningful description instead, and put the URL in the hyperlink. |
||||
|
You can use CSS overflow-wrap: break-word; to break up words that would overflow a container. See: https://developer.mozilla.org/en... |
||||
|
|
){kind=link}