How do i break text to the next line in css?
I have a fixed width div on my page that contains text. When I enter a long string of letters it overflows. I don't want to hide overflow I want to display the overflow on a new line, see below: Show
Is there anyway to disable overflow and put the overflowing text on a new line??? Twitter does something like this but I can't figure it out with CSS it's possible they are using Javascript. Can anybody help with this??
asked Aug 27, 2010 at 19:11
0 Just add
to the text, a line text will come automatically in the next line.
Jan 2,0502 gold badges28 silver badges34 bronze badges answered Sep 28, 2015 at 7:37
Pankaj VermaPankaj Verma 3,2191 gold badge9 silver badges2 bronze badges 6 Try the answered Aug 27, 2010 at 19:19
casablancacasablanca 68.5k7 gold badges132 silver badges148 bronze badges Well, you can stick one or more "soft hyphens" ( Now, how exactly would you pick where to stuff those characters? That depends on the actual string and what it means, I guess. answered Aug 27, 2010 at 19:15
PointyPointy 394k59 gold badges574 silver badges607 bronze badges 1 The
Syntax
Values
The demo below has a toggle button that allows you to switch between To demonstrate the problem that A string of non-breaking space characters (
Similarities to the word-break property
After describing examples of how From this, we can surmise that The historical word-wrap property
Both Browser supportDesktop
Mobile / Tablet
More information
How do you separate text in CSS?Approach:. Create an HTML div element with the class “container”.. Inside the “container”, create an HTML div with class “box”.. Create two p tags with text.. To split the text we are going to provide the text shape using clip-path and then use transform property on hover to translate it.. How do I show text on the next line?: The Line Break element. The HTML element produces a line break in text (carriage-return). |