Support » Fixing WordPress » Mobile sidebar not moving to bottom

  • At this site I have tried several ways to get a good mobile view with the sidebar on the bottom. After writing my own code didn’t seem to work, I tried Jetpack’s Mobile plugin, which is what is there now. Here are several things I tried with the custom css:

    @media screen and (min-width: 1164px) {
    	.sidebar {
    		width: 20%;
    		float: left;
    	}
    }
    
    @media screen and (min-width: 320px) and (max-width: 1163px) {
    	.sidebar .left-sidebar {
    		width: 100%;
    		float: bottom !important;
    	}
    
    	.skip-link {
    		display: /*don't do anything*/
    	!important;
    	}
    }
    
    .mobile-theme .sidebar {
    	float: bottom !important;
    }

    Then I read that Jetpack will put sidebars with the class name sidebar-1 at the bottom, but my theme is complicated so I found a javascript that would change the name of the class, so I added this to the header area:

    <script type="text/javascript">
        document.getElementById("left-sidebar").className =
    document.getElementById("left-sidebar").className.replace
          ( /(?:^|\s)sidebar-1(?!\S)/g , '' )
        }
    </script>

    None of these things have worked. I like the Jetpack Mobile look, but I’d like to see the sidebar at the bottom. How can I accomplish that? Or is there a better plugin?

Viewing 2 replies - 1 through 2 (of 2 total)
  • review
    http://www.w3schools.com/css/css_float.asp

    also, make sure to use the right CSS selectors;
    for example:

    .sidebar.sidebar-left instead of .sidebar .sidebr-left

    you might need to work with a browser inspection tool to check these.

    PS: as the left sidebar code is output before the central content, it might be difficult or impossible to get the sidebar to the bottom by just changing the floats.

    ideally post in your theme’s forum at http://wordpress.org/support/view/theme-reviews/childishly-simple

    Thread Starter JoyceD6

    (@joyced6)

    .sidebar.sidebar-left instead of .sidebar .sidebr-left

    I tried this both ways and it didn’t work. I tried many different ways and checked the spelling, too.

    I will try the theme forum, but I thought someone might know of a plugin that would work on this theme or specifically how I could edit the code. Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Mobile sidebar not moving to bottom’ is closed to new replies.