CSS: exceeding width when nospace?
#profileWall{
margin: auto;
width: 1200px;
}
And then inside it, if i have this without no space at all:
sdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasadsadsadsadsadssdfasads
It exceeds the width and just continues. But if there开发者_StackOverflows spaces in it it cuts and goes to new line when it reach the width like it should.
How can i fix this?
overflow:hidden
or with CSS3
word-wrap: break-word
CSS3 thanks to @mistabell
There a couple of solutions.
Use overflow. Because there are no spaces, the browser won't be able to add a new line. So, you can control the div by setting overflow:scroll or overflow:hidden. This will either add scroll bars or hide the long data.
Use code on the backside to inject a space after some number of characters. A lot of sites do this in combination with adding a link for [more].
Redesign your site to accommodate long non-breaking text.
Don't allow such input to begin with. If this is text that someone is typing and it's supposed to be normal words, just test word length to see if you have any words longer than about 30 characters. You could either automatically inject a hyphen in there to allow word wrap or simply not allow gibberish. Adjust as necessary.
Go the twitter route and just don't allow more than 140 characters. Design the site accordingly.
Here ya go: http://jsfiddle.net/VEu6w/
white-space: nowrap;
精彩评论