[resolved] Sidebar not floating right on mobile device (6 posts)

  1. bolamuyis
    Posted 3 years ago #

    The sidebar floats right as desired on desktop view but on the iPhone and iPad the sidebar is positioned directly under the main content area and won't float right! Any ideas please...

    Here's the site address:

    view on mobile device to see the problem.

  2. WPyogi
    Forum Moderator
    Posted 3 years ago #

    That's generally how sidebars are intended to behave on small screens. If you want it to do otherwise, you'd need to look at the responsive code and modify it. That appears to be a custom theme?

  3. bolamuyis
    Posted 3 years ago #

    But the page width is wide enough to accommodate the primary and secondary divs. There's got to be a solution.

  4. Michael
    Forum Moderator
    Posted 3 years ago #

    the theme is a 'customized' Twenty Eleven.

    you seem to have some essential 'floats's removed from #primary and #secondary in style.css; the sidebar is below the content even in FF17 on a normal screen.

    possibly re-do the customisations starting with a fresh copy of Twenty Eleven.

    or ask at a css forum - http://csscreator.com/forum

  5. bolamuyis
    Posted 3 years ago #

    alchymyth, you checked out site while I was making another attempt at the problem. Anyway I was able to resolve it by adding the following code to the style.css:

    .right-sidebar #main #secondary {
          float: right;
          margin: -0px 1% 0 1%;

    Don't know why but this worked like a charm.

  6. brabantia
    Posted 3 years ago #

    bolamuyis, I tried your solution but it doesn't work for me. The desktop version looks cramped and the iPad version still pushes the sidebar to the bottom.
    If you found a working .css code for the @media tag, I'd be so happy!

    meanwhile I'm going to try my luck at


Topic Closed

This topic has been closed to new replies.

About this Topic