Search code examples
htmlipadmobile-safari

How can I set the width of form select boxes in Mobile Safari/iPad?


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!


Solution

  • 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.