Title: small device elements not stack
Last modified: August 22, 2016

---

# small device elements not stack

 *  Resolved [andrewf9](https://wordpress.org/support/users/andrewf9/)
 * (@andrewf9)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/)
 * [http://torillfonn.com](http://torillfonn.com)
 * Hi, Until recently, I had this site working responsively on small devices. However,
   yesterday I found that you cannot see anything below the breadcrumb on e.g. small
   mobile telephone. The nav menu works properly but no left sidebar or any elements
   below the breadcrumb show until the viewport gets wide e.g. over 760px.
 * The only way i can get the site to behave responsively on small devices is to
   disable both sidebars, but that is not what i want!
 *  I have done research into Twitter bootstrap 2 grids and responsive design, but
   cannot nail down the root cause? I am using a child theme of Customizr. Have 
   added some custom CSS but was working fine until up until now. Recently upgraded
   the site, plugins and themes to WordPress 4.0. What I have tried to figure out
   is how the CSS re-jigs the sidebar(s) so they stack in one vertical column. It
   seems like the mechanism for that needs re-enabling? Thank you in advance..

Viewing 7 replies - 1 through 7 (of 7 total)

 *  [rdellconsulting](https://wordpress.org/support/users/rdellconsulting/)
 * (@rdellconsulting)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/#post-5338917)
 * Did you look in Customize>Responsive settings>Enable/disable blocks reordering
   on small devices?
 *  Thread Starter [andrewf9](https://wordpress.org/support/users/andrewf9/)
 * (@andrewf9)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/#post-5339017)
 * Hi, Thanks, yes, i did look there. I checked theme settings and when I found 
   that one, I thought I might have found the root cause! But it was already enabled.
   I have been using firebug responsive and have found out that at 800 screen width
   the left sidebar loads (scaled down in size), the dropdown menu appears and I
   can retrieve content e.g. load the home page. This works at even smaller screen/
   device size. But the single column stack is not happening at all.
 * I upgraded customizr theme recently. I notice some changes, e.g. they now have
   two versions of each .css, one minified. However the unminified one is minified,
   too. I am not sure if there may be some teething problems with the new theme,
   therefore impacting on my child one? My hosting company has also introduced their
   own ‘optimised’ version of wordpress available as a softaculous script. I am 
   keeping the older unoptimised version. So could it be down to some kind of page
   caching that they have introduced?
 *  Thread Starter [andrewf9](https://wordpress.org/support/users/andrewf9/)
 * (@andrewf9)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/#post-5339067)
 * I can confirm that this is a possible bug introduced into the latest version 
   of the Customizr theme. I have reported it to the theme author, Nicolas. The 
   new version has some structural changes and this might be impacting on my site
   but possibly not on all upgraded sites?..
 *  Theme Author [presscustomizr](https://wordpress.org/support/users/nikeo/)
 * (@nikeo)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/#post-5339072)
 * Hi Andrew, can you try
    1) to disable (temporarily) all plugins (and custom javascript
   code) on your website 2) refresh your browser cache => see if it fixes the issue.
   Thanks
 *  Thread Starter [andrewf9](https://wordpress.org/support/users/andrewf9/)
 * (@andrewf9)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/#post-5339087)
 * Hi Nikeo, Thank you for responding!
    I have set up a staging copy of the production
   site and have done a lot of trial and error.
 * Just tried your above steps but no change. However, the trial and error I have
   done over the past few days has helped to narrow down and reduce the scope of
   the problem.
 * Here is summary of what i have done so far:
 * a) Restored a copy of the ‘old’ version of your customizr theme into the ‘themes’
   directory of my site. The single stacking feature began working again.
 * I want to use the latest version of your theme, however, so tested it out with
   rebuilt versions of my child theme (I assumed that it is my child theme which
   although it works okay with the ‘old’ version of your theme, is the source of
   the problem with your new version.
 * b) So i rebuilt the child theme strictly according to ‘best practice’ on your
   Customizr documentation site. So moved my custom CSS into a ‘style.css’ file.
   However, i found that i needed to [@import](https://wordpress.org/support/users/import/)
   the ‘grey.css’ file (this was not explained in documentation) from the parent
   theme. I then added my custom CSS to the style.css file (in the child theme root
   folder).
 * Then most of the pages began stacking in single columns on small mobile device
   screens e.g. around 300px x ? resolution.. So the only issue now is that i have
   a custom post type called ‘myraces’. I have created a couple of custom templates
   to display these: and archive template and a single template. The archive templates
   displays a list of the ‘my races’ etc…
 * These pages are not displaying in single stack on small mobile screens. I guess
   this is due to my dodgy CSS classes used to wrap fields in the templates. I may
   be using one or two div classes that upset the responsiveness of the site under
   your latest theme but which I got away with using under the ‘old’ version…
 * If you have any ideas on this, would be really useful! Otherwise i will probably
   try rebuilding the templates and experimenting with various twitter bootstrap
   classes inside them to try to make the pages fully responsive i.e. displaying
   in a single stack on small device screens.
 *  Thread Starter [andrewf9](https://wordpress.org/support/users/andrewf9/)
 * (@andrewf9)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/#post-5339159)
 * Hello Nikeo and rdellconsulting,
    I managed to track down the problem. The problem
   turned out to be a class inside a couple of custom templates i created. I checked
   out the example custom template and changed a couple of div classes in line with
   best practice. Then the child theme began working responsively again.
 * So it was ‘human error’. I also removed custom CSS from the grey.css file according
   to best practice for Custmizr and copied it into the style.css file for my child
   theme.
 * Thanks,
    Andrew
 *  Theme Author [presscustomizr](https://wordpress.org/support/users/nikeo/)
 * (@nikeo)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/#post-5339160)
 * Thanks for the feedback [@andrewf9](https://wordpress.org/support/users/andrewf9/)!

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘small device elements not stack’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/customizr/4.4.24/screenshot.png)
 * Customizr
 * [Support Threads](https://wordpress.org/support/theme/customizr/)
 * [Active Topics](https://wordpress.org/support/theme/customizr/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/customizr/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/customizr/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [theming](https://wordpress.org/support/topic-tag/theming/)

 * 7 replies
 * 3 participants
 * Last reply from: [presscustomizr](https://wordpress.org/support/users/nikeo/)
 * Last activity: [11 years, 7 months ago](https://wordpress.org/support/topic/small-device-elements-not-stack/#post-5339160)
 * Status: resolved