Align Text in P Tags side by side while maintaining Break-Word

Question

I'm trying to align 3 p tags side by side, and make them all function like a single paragraph styled with the attribute: WordWrap:Break-Word

So that it keeps the p tags next to each other free to move to the next line or stretch into a single line depending on the size. The end result should look soimething like this:

This is a sample of the word streteched out:

*<p>sample document<p/><p>sample document<p>sample document</p>*

This is a sample of the words crunched together:

*<p>sample document<p/><p>sample 
document<p>sample document</p>* 

http://jsfiddle.net/5fdd6/75/

Here's the jfiddle with the 3 p tags.

Answer 1

just try

p{
 display:inline;
 word-wrap: break-word;
}

DEMO here

Answer 2

Check this fiddle

You just need to have this in css

p{
    float:left;
}

Try it..