This is a follow-up to a short thread I started on responsive 
menus<https://groups.google.com/forum/?hl=en&fromgroups=#!topic/twitter-bootstrap/_6ZIyyRYy8E>.
 
My problem is that dropdown tabs I've set up, whilst working fine on a 
desktop browser, fail miserably on an Android smartphone (and possibly 
other mobile devices, but I only own a smartphone). In a test doc I've 
created <http://www.fredriley.org.uk/callhull/test.html>, if using a mobile 
you click on one of the dropdown links (eg Celtic) you see the dropdown 
menu. However, if you click on any option in the dropdown the menu either 
collapses back up or the click goes through to a link below the menu on the 
page. The result is that you can never go to the main page. Apparently this 
is a known problem (see Github 
'issue')<https://github.com/twitter/bootstrap/issues/4550>but should have been 
fixed in 2.2, which I'm using. Is there a simple fix 
in the page markup which doesn't require messing with the Bootstrap CSS/JS 
(that way madness and update problems lie)? 

An alternative might be to use split dropdowns, as at least then the user 
can click on the tab and go to the page, but although there's info on split 
button 
dropdowns<http://twitter.github.com/bootstrap/components.html#buttonDropdowns>it's
 not clear to me if you can do this with tabs. 

I've looked at the fine manual, in particular responsive 
navbar<http://twitter.github.com/bootstrap/components.html#navbar>and JS 
dropdowns <http://twitter.github.com/bootstrap/javascript.html#dropdowns>. 
If I can't solve this problem then I'll have to hack the site so that, if 
it's showing on a mobile, the dropdown menus just don't appear, but that 
could be quite a CSS faff and a major reason for using frameworks such as 
Bootstrap is to save time over coding from scratch. 

Fred

Reply via email to