A community in which webmasters can ask for help with topics such as PHP coding , MySQL , IT jobs, web design, IT security.
Current location:homephp forumphp talk in 2008 yearHow to wrap long lines without spaces in HTML? - page 1
User InfoPosts
How to wrap long lines without spaces in HTML?#1
If a user types in a long line without any spaces or white space, it will break formating by going wider than the current element. Something like:


I've tried just using wordwrap() in PHP, but the problem with that is if there is a link or some other valid HTML, it breaks.

There seems to be a few options in CSS, but none of them work in all browsers. See word-wrap in IE.

How do you solve this problem?

posted date: 2008-12-12 09:03:00

Re: How to wrap long lines without spaces in HTML?#2
I had made out the solution of this problem. click to view my topic...

hope that hepls.

posted date: 2008-12-12 09:03:01

Re: How to wrap long lines without spaces in HTML?#3
I dodge the problem by not having my right sidebar fixed like that :P

posted date: 2008-12-12 09:06:00

Re: How to wrap long lines without spaces in HTML?#4
I would put the post in a div that would have a fixed width setting overflow to scroll (or to hide completely depending on the content).so like:#post{ width: 500px; overflow: scroll;}But that's just me.EDIT: As cLFlaVA points out... it is better to use auto then scroll. I do agree with him.

posted date: 2008-12-12 09:10:00

Re: How to wrap long lines without spaces in HTML?#5
Here's what I do in ASP.NET:Split the text field on spaces to get all the wordsIterate the words looking for words that are longer than a certain amountInsert every x characters (e.g. every 25 characters.)I looked at other CSS based ways of doing this, but didn't find anything that worked cross-browser.

posted date: 2008-12-12 09:11:00

Re: How to wrap long lines without spaces in HTML?#6
I like to use the overflow: auto CSS property/value pairing. This will render the parent object the way you'd expect it to appear. If the text within the parent is too wide, scrollbars appear within the object itself. This will keep the structure the way you want it to look and provide the viewer with the ability to scroll over to see more.Edit: the nice thing about overflow: auto compared to overflow: scroll is that with auto, the scrollbars will only appear when overflowing content exists. With scroll, the scrollbars are always visible.

posted date: 2008-12-12 09:12:00

Re: How to wrap long lines without spaces in HTML?#7
Oh, I see. By one line going over it's expanded the entire box to go over there. What a bitch. I should probably stop typing because by now this text is off the edge.

posted date: 2008-12-12 09:17:00

Re: How to wrap long lines without spaces in HTML?#8
There is no "perfect" HTML/CSS solution.The solutions either hide the overflow (ie scrolling or just hidden) or expand to fit. There is no magic. Q: How can you fit a 100cm wide object into a space only 99cm wide?A: You can't.You can read break-wordEDITPlease check out this solution http://www.momige.com/330229/how-to-apply-a-line-wrapcontinuation-style-and-code-formatting-with-cssorhttp://www.momige.com/320184/who-has-solved-the-long-word-breaks-my-div-problem-hint-not-stackoverflow

posted date: 2008-12-12 09:21:00

Re: How to wrap long lines without spaces in HTML?#9
I understand, but users will occasionally do this, so there needs to be some solution to handle it so the layout doesn't break. word-wrap only works in IE.

posted date: 2008-12-12 09:25:00

Re: How to wrap long lines without spaces in HTML?#10
I haven't personally used it, but Hyphenator looks promising.Also see related (possibly duplicate) questions:word wrap in css / jsWho has solved the long-word-breaks-my-div problem? (hint: not stackoverflow)

posted date: 2008-12-12 09:30:00

Re: How to wrap long lines without spaces in HTML?#11
based on Jon's suggestion the code that I created:public static string WrapWords(string text, int maxLength) { string[] words = text.Split(' '); for (int i = 0; i < words.Length; i++) { if (words[i].Length > maxLength) //long word { words[i] = words[i].Insert(maxLength, " "); //still long ? words[i]=WrapWords(words[i], maxLength); } } text = string.Join(" ", words); return (text); }

posted date: 2009-11-07 11:28:00

Re: How to wrap long lines without spaces in HTML?#12
I have posted a solution which uses JavaScript and a simple Regular Expression to break long word so that it can be wrapped without breaking your website layout.Wrap long lines using CSS and JavaScript

posted date: 2010-01-11 05:22:00

select page: « 1 2...»
Copyright ©2008-2017 www.momige.com, all rights reserved.