As per object, on Bootstrap's col-xs devices (expecially when running Chrome) there's a small overlap between these two big main divs, #content and #sidebar-menu. This is preventing both correct website usage and sidebar menu hiding (the show-hide-sidebar-menu button falls behind the sidebar-menu div and hence it's not visible).
I've noticed this is due to a wrong match between the number of columns assigned to sidebar div and the number of columns assigned to the content div when dealing with col-xs-sized devices. Here's the code:
bootstrap_admin/templates/admin/base.html:83<div id="content" class="{% if is_displaying_menu %}col-xs-9 [...]
As you can see, with col-xs-6 and col-xs-9 we're having a total of 16 columns here... A bit too many :)
I've fixed that by replacing the "9" with another "6", which as far as I have seen leads to the best result. Any combination with a total of 12 would of course work as well. In any case, we have to accordingly replace as well the value here, or the menu won't hide correctly:
Seether85
commented
9 years ago
As per object, on Bootstrap's col-xs devices (expecially when running Chrome) there's a small overlap between these two big main divs, #content and #sidebar-menu. This is preventing both correct website usage and sidebar menu hiding (the show-hide-sidebar-menu button falls behind the sidebar-menu div and hence it's not visible).
I've noticed this is due to a wrong match between the number of columns assigned to sidebar div and the number of columns assigned to the content div when dealing with col-xs-sized devices. Here's the code:
bootstrap_admin/templates/admin/base.html:68
<div id="sidebar-menu" class="col-xs-6 col-sm-3 col-md-2 sidebar-menu">bootstrap_admin/templates/admin/base.html:83
<div id="content" class="{% if is_displaying_menu %}col-xs-9[...]As you can see, with col-xs-6 and col-xs-9 we're having a total of 16 columns here... A bit too many :)
I've fixed that by replacing the "9" with another "6", which as far as I have seen leads to the best result. Any combination with a total of 12 would of course work as well. In any case, we have to accordingly replace as well the value here, or the menu won't hide correctly:
bootstrap_admin/static/bootstrap_admin/js/base.js:31
main_classes = 'col-xs-9[...]In my case, I've put a "6" there as well, as it has to match the one in base.html:83.
Hope this helps. Cheers.