Hassan Sardar
Hassan Sardar

Reputation: 4523

How to align DIV contains String with no Spaces

I have a Dynamic String with no Spaces

i.e: 12345678912345678912345634589 // This is a dynamic content from php.

And i have a DIV with 200px width So this String is going out of the DIV if there is no spaces in the String. How can i fix it? I want this string started from New Line when it reaches the width limit of 200px.

I have also made a JsFiddle DEMO :

http://jsfiddle.net/ACF7N/6/

Upvotes: 0

Views: 114

Answers (4)

Venkata Krishna
Venkata Krishna

Reputation: 15112

#description
{
    border:1px solid #BBBBBB;
    width:200px; 
    word-wrap: break-word; //Add this
}

Alternatively, You can also use

overflow-wrap:break-word; 

From the specification, http://www.w3.org/TR/css3-text/#overflow-wrap, ‘word-wrap’ as an alternate name for the ‘overflow-wrap’

Upvotes: 0

Albzi
Albzi

Reputation: 15609

If you're looking for the content to be on one line still, you can use something similar to this to get that:

#description
{
    border:1px solid #BBBBBB;
    width:200px;
    overflow:hidden; //add this
    text-overflow:ellipsis;  //and this
}

If you're not worried about it going onto a new line, one of the other answers will help you :)

Upvotes: 0

nnnnnn
nnnnnn

Reputation: 150040

Add this CSS:

word-wrap : break-word;

Demo: http://jsfiddle.net/ACF7N/7/

Upvotes: 2

Grim...
Grim...

Reputation: 16953

div {
    word-break: break-all;
}

http://www.w3schools.com/cssref/css3_pr_word-break.asp

Upvotes: 4

Related Questions