Basically, at the moment, I have a CSS drop down menu on hover and it doesn't seem to be working on ipad and iphone users, I understand that they don't have a 'hover' but a click would work just as good, anyone have an idea on how to get this to work?

Investigate coding with media queries as a drop down menu should be expanded as a vertical list in small screen devices.

http://kyleschaeffer.com/best-practices/responsive-layouts-using-css-media-queries/

Investigate coding with media queries as a drop down menu should be expanded as a vertical list in small screen devices.

http://kyleschaeffer.com/best-practices/responsive-layouts-using-css-media-queries/

 

It is a vertical list though? unless I am missing something why wouldn't a standard ul, li list work normally on ipad on a click?

Edited May 18, 201214 yr by OwenONeill

Media queries seem to get rid of all widths and convert everything, even table cells, from horizontal to vertical so that users of small screen devices only have to scroll vertically. That's what happens to one of my sites, anyway.

 

It doesn't change if you just reduce a window to a small width on a PC, but Opera has a View/Fit to Width which simulates a small screen device so you can see the difference.

Edited May 18, 201214 yr by Wickham

.... they don't have a 'hover' but a click would work just as good, anyone have an idea on how to get this to work?

 

Only if it's coded to use the active click state. Really, it would be preferable to test for and then use a touch event to trigger the dropdown.

 

Short answer, dropdowns are very hard to get right on very small screens. Strongly question whether they are *really* required.