Thanks to help from this group, and the excellent Bootstrap docs, I've put together a static site <http://www.fredriley.org.uk/callhull/> which looks half-decent on a desktop or laptop. However, it looks dire on mobile devices and features get lost. Even if you just narrow the browser window on a desktop the top navbar items go walkies. Another problem is that drop-down menus on a mobile (for instance in this doc<http://www.fredriley.org.uk/callhull/celtic.html>) will drop down, but clicking on a dropdown item hits the menu beneath it. There are other problems with the site on mobiles, but basically it's not usable, and of course with mobiles being so popular this is a problem.
I have included the Bootstrap responsive CSS file in my pages and used a collapsing top navbar, but plainly I need to do more to make the thing usable on mobiles so I'd be grateful for tips and pointers. I have read the fine manual on responsive design<http://twitter.github.com/bootstrap/scaffolding.html#responsive>though that doesn't have much to say. I've used a famous search engine to look for "bootstrap responsive menus<https://www.google.co.uk/search?q=bootstrap+responsive+menus&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:en-GB:official&client=firefox-a>" but without any conclusive results. There's an intriguing stackoverflow question<http://stackoverflow.com/questions/9150423/how-do-i-get-the-navigation-to-collapse-into-the-small-icon-for-mobile-devices>which might be useful but isn't a whole answer. It's getting late in the night, my eyes are hurting, the neurons are turning off and the beer is calling, so I can't do any more searching now. Is there a guide somewhere to creating responsive menus in Bootstrap so that a page degrades gracefully on mobiles? I'm happy to RTFM if I can find TFM. And/or, are there any good exemplar sites I can emulate? I am familiar with responsive design practice and media queries, though am far from an expert. Cheers Fred
