I am developing a web-based menu application targeted solely for Mobile Safari on the iPad (in other words, I am not at all concerned about cross-browser compatability). I have a form select box which contains a number of options the user can choose from to modify their order, which when clicked displays on the iPad as follows: Screenshot
The problem is that this box is not wide enough to show the user the price or even the full name for several options. Smaller names is not a particularly attractive option in this case. Is there any way in which I can either a.) set the width of this box (doesn't matter if it's a Mobile Safari-specific solution!) or b.) make it so that the box grows wider to accommodate the widest option? I can find nothing on Google that deals with my question save for one forum thread with no useful answers.
Javascript is an option, if necessary.
Thanks!
To the best of my knowledge I believe UIKit entirely with the popup. The only advice I could suggest would be to implement it solely in JavaScript. I've had a quick Google and nothing is coming up that stands out as a existing one.