Make text in paraghapghs in div overflow instead of new lines

Question

Say I have several pretty longs lines in a paragraph:

<div style="overflow: auto"> 
    <p> 
        aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb cccccccccccccccccccccccccccccccc
    </p> 
    <p> 
        aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb cccccccccccccccccccccccccccccccc
    </p> 
</div>

and window width less that width of the pahagraph (a's + b's + c's). Currently scroll will appear only if width of any of components (a, b, or c) is more that width of the window and over components are carried to the new lines. I want contents of each paragraph appear on the same line with a scroll. How can I treat each paraghaph as a string, so contents of the paragraph is treated like a single line?

Answer 1

With CSS you can do:

p {
    white-space: nowrap;
    overflow: auto
}

This make the spaces non-breaking, so the paragraph will all be on one line.