jQuery Mobile Select Box Not Showing Up

jQuery Mobile is a great framework with lots of great out-of-the-box magic.

I am in the middle of converting a site over from a full website to a mobile version. I was really frustrated when I tried to click on a select box and nothing would happen. If my header/footer were fixed, they would just toggle on and off. I assumed it was the fixed positioning, and I was wrong.

Through some FireBug debugging, I found the problem. It probably won’t affect many people, but it’s worth pointing out. I had a set a width through CSS on the select item for the desktop version. When I ported into the mobile version, I left the CSS width in there. So if I happened to click on the very far left of the button, it worked.

I removed the width and all is right in the world again. 🙂