Hi guys. Working on a webapp here that must run on the iPad (so, Safari Mobile).

I have this code that works fine in just about anything except iPad:

<select class="gwt-ListBox" size="12" multiple="multiple">
    <option value="Bleeding Eyelashes">Bleeding Eyelashes</option>
    <option value="Smelly Pupils">Smelly Pupils</option>
    <option value="Bushy Eyebrows">Bushy Eyebrows</option>
    <option value="Green Vessels">Green Vessels</option>
    <option value="Sucky Noses">Sucky Noses</option>
</select>

What it's supposed to look like is a box with 12 lines ans 5 of them filled up. It works fine in FF, IE, Chrome, Safari Win. But, when I open it on iPad, it's just a single line!

Styling it with CSS doesn't work. It just makes the single line bigger if I set the height. Is there a way to make it behave the same way as in normal browsers, or do I nave to make a custom component?

Thanks.