CSS Or HTML Linebreaks IN Words

CSS Or HTML Linebreaks IN Words

molkman
Owner of George Washington's Prototype Mittens

Marine Warfare Corporal
Find the Hole Participation Medal
Find the Hole II Participation Medal
Tasty Br�twurst Medal
2005 May 2 • 2066
404 ₧
Y'know, normally when displaying a text on a webpage that is longer than a line, line breaks are added between words. However, I'd like them to be in words, even without dashes.

So neither

code
Blabitty
blabitty bla bla


nor

code
Blabitty bla-
bitty bla bla


But:

code
Blabitty bla
bitty bla bla


Is that possibleeeeeee?
LET LOVE REIGN
 
 
2010 May 27 at 11:39 PDT — Ed. 2010 May 27 at 11:39 PDT
the_cloud_system
polly pushy pants

2008 Aug 1 • 3070
-6 ₧
molkman said:
Y'know, normally when displaying a text on a webpage that is longer than a line, line breaks are added between words. However, I'd like them to be in words, even without dashes.

So neither

code
<{Blabitty}>
blabitty bla bla


nor

code
Blabitty bla-
bitty bla bla


But:

code
Blabitty bla
bitty bla bla


Is that possibleeeeeee?

I drink to forget but I always remember.
 
 
2010 May 27 at 13:34 PDT
SRAW
Rocket Man

2007 Nov 6 • 2525
601 ₧
BLAH
Free Steam Games
 
 
2010 May 27 at 18:50 PDT
SuperJer
Websiteman

2005 Mar 20 • 6201
I don't think so. Unless there is some crazy CSS option for that I'm unaware of.

You'll need to do that server-side if you can.

Or javascript I guess.
 
 
2010 May 27 at 20:51 PDT
molkman
Owner of George Washington's Prototype Mittens

Marine Warfare Corporal
Find the Hole Participation Medal
Find the Hole II Participation Medal
Tasty Br�twurst Medal
2005 May 2 • 2066
404 ₧
Okay, but server-side would change it on the whole site, right? I just want it in certain places.
LET LOVE REIGN
 
 
2010 May 28 at 09:47 PDT
protobuf
The artist formerly known as RibsRizeRainbmo

2010 Apr 15 • 14
The following CSS3 properties may work, but I don't think they're supported in most browsers.

text-wrap: unrestricted;
word-wrap: break-word;
 
 
2010 May 28 at 10:08 PDT
SuperJer
Websiteman

2005 Mar 20 • 6201
molkman said:
Okay, but server-side would change it on the whole site, right? I just want it in certain places.

Server-side you can choose where to modify the content like that. For example if you are running PHP:
php code

<?php
if(/* wrap $content HARD! */)
{
echo
preg_replace( "~.{70}~", "\\0<br>", $content );
}
else
{
echo
$content;
}
?>


That will insert a <br> every 70 characters depending on what you put for the if's condition.
 
 
2010 May 28 at 15:49 PDT
SuperJer
Websiteman

2005 Mar 20 • 6201
protobuf said:
text-wrap: unrestricted;
word-wrap: break-word;


Well let's try it:
text-wrap: unrestricted;
Here's some test content for wrapping and smashing to little bits of putrid ectoplasmicalmatterbits. Your rotten hamlion spawn is heavier than a wet sack of concrete bananas!
word-wrap: break-word;
Here's some test content for wrapping and smashing to little bits of putrid ectoplasmicalmatterbits. Your rotten hamlion spawn is heavier than a wet sack of concrete bananas!
 
 
2010 May 28 at 15:54 PDT — Ed. 2010 May 28 at 15:55 PDT
the_cloud_system
polly pushy pants

2008 Aug 1 • 3070
-6 ₧
superjer: breaking forum physics
I drink to forget but I always remember.
 
 
2010 May 28 at 17:31 PDT
molkman
Owner of George Washington's Prototype Mittens

Marine Warfare Corporal
Find the Hole Participation Medal
Find the Hole II Participation Medal
Tasty Br�twurst Medal
2005 May 2 • 2066
404 ₧
Cool.

But is it like, working sometimes? "Ecoplasmical" is in a new line.

Update: Looks like it still "obeys" certain "break points" or something.
LET LOVE REIGN
 
 
2010 May 29 at 03:20 PDT — Ed. 2010 May 29 at 03:34 PDT
SuperJer
Websiteman

2005 Mar 20 • 6201
Looks to me like word-wrap: break-word; does just what you want on Chrome. I don't know about other browsers.
 
 
2010 May 29 at 12:18 PDT
Rockbomb
Dog fucker (but in a good way now)

2009 Nov 13 • 2045
I <3 Chrome
 
 
2010 May 29 at 12:20 PDT
molkman
Owner of George Washington's Prototype Mittens

Marine Warfare Corporal
Find the Hole Participation Medal
Find the Hole II Participation Medal
Tasty Br�twurst Medal
2005 May 2 • 2066
404 ₧
Hm, my Chrome doesn't. Apparently it still only breaks words at "logical" points and not smashing everything like a crazy viking.
LET LOVE REIGN
 
 
2010 May 29 at 13:55 PDT
Page [1]