text wrap in div

how can I stop the text in this div from going outside the element?

 

use below css

word-wrap: break-word;

Code (markup):

 

create a new class called content in css and give the width becausein html you have <div class="content"> but in css codes you have nothing about that
I give you an example:

.content {
    width:350px;
    padding:15px 0;
    text-align:left;
    color:#fff
}

Code (markup):

 

@bhuthecoder has it right... break-word (which was 'just' added in HTML 3 in 'modern' browsers, but also works all the way back to IE 5.0) will ... break the word up as needed.

IE5, doing what CSS3 calls "new" since 1998.

No clue what the blue blazes @AlbCoder is prattling on about.

Though I'm hoping the fixed size and fixed metrics is just for testing, since that's accessibility trash...

 

Wouldn't any 'normal' text include some whitespace, e.g. spaces?

An unbroken string of characters is seldom (ever?) a reasonable test argument. Try using a lorem ipsum string.

cheers,

gary

 

I'd be assuming that's a testcase for some really long words and not the actual data... though that could hinge on your definition of normal...

Given the ridiculously tiny fixed width, it's a legitimate concern if you have constantly changing data -- you never know when you might want to use the word "pneumonoultramicroscopicsilicovolcanoconiosis" or "pseudopseudohypoparathyroidism" -- proper chemical names regularly break the "magic 78" barrier... some get absolutely massive, like the proper chemical name for the protein "titin" which weighs in at almost 190K characters long.

... or one could just be trying to fit the text of Mary Poppins in the page -- "supercalifragilisticexpialidocious"

Though a more common concern is cross OS compatible filenames (no spaces) or usernames where the user is being a pain in the ass (a common blight upon forums).

 

If it were the case of needing support for ungainly, specialty words, I'd expect the OP to mention it. Without that clarification, my working hypothesis is that a poor choice of test text is the root of his problem. One should expect horses rather than zebras upon hearing hoof beats; unless on the Serengeti.

cheers,

gary