[jQuery] Multiple select box line wrap

[Paul Collins]

Hi all

I'm have a fixed width on a multiple select box. The problem is, some of the
options are longer than the width and by default the lines won't wrap. I'm
wondering if anyone has seen a way of making lines wrap using either CSS or
JQuery. I've added a title to each option, so you can get the full content
if you hover over an item, but really need the text to wrap.

Here's how the HTML code looks:

<select multiple="multiple">
    <option title="Item 1 -    brief description lorem ipsum dolor sit amet
consectateur adipscing elit.">
        Item 1 -
        brief description lorem ipsum dolor sit amet consectateur adipscing
elit.
    </option>
    <option title="Item 2 -    brief description lorem ipsum dolor sit amet
consectateur adipscing elit.">
        Item 2 -
        brief description lorem ipsum dolor sit amet consectateur adipscing
elit.
    </option>
    <option title="Item 3 -    brief description lorem ipsum dolor sit amet
consectateur adipscing elit.">
        Item 3 -
        brief description lorem ipsum dolor sit amet consectateur adipscing
elit.
    </option>
</select>

Would appreciate any help.
Cheers
Paul