Appfinite

Premium WordPress Themes for The Genesis Framework

Sidebar Issue

Home › Community Forums › Aspire Theme Support › Sidebar Issue

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • September 20, 2017 at 6:21 pm #21956
    jamesc8913
    Customer

    Hi Wes! On some monitors, the sidebar on my pages floats to the bottom left after the content area. What’s going on? How can I fix this? Thanks!

    September 21, 2017 at 12:24 am #21958
    Wes
    Moderator

    That sounds like it could be the Mobile Responsive code kicking in….It’s supposed to move under the content when the browser shrinks to a tablet or mobile phone size/width. What happens when you view the Aspire Demo? Does it act the same as your site?

    Do you know what size the browsers are on those monitors?

    What’s the link to your site? I can check it out from my end

    September 21, 2017 at 5:22 pm #21959
    jamesc8913
    Customer
    This reply has been marked as private.
    September 23, 2017 at 6:25 pm #21964
    jamesc8913
    Customer

    Hi Wes, any findings on this?

    September 24, 2017 at 6:18 pm #21965
    Wes
    Moderator

    I checked the Aspire Theme Demo and it’s default CSS and noticed the issue doesn’t happen there or on any other site that uses the theme. So that means it must be something going on with some custom code added to your CSS somewhere. This can happen if you’ve edited the CSS file and customized either the Main Content or Sidebar areas.

    I noticed the issue happens on your site when the browser is open or resized between 1200px – 1280px width.

    Give me a sec and let me see if I can locate where it’s coming from.

    September 24, 2017 at 6:29 pm #21966
    Wes
    Moderator

    Ok, it looks like the .content width was changed to 790px, and the sidebar width was changed to 410px in your CSS. So when the browser reaches between 1200px – 1280px the Content and Sidebar areas are too wide to fit inside the width of the screen due to the extra space and padding that was added.

    The default width of the theme in the .content section is 700px. If you change it back to 700 it will work. If you want to add more width to widen the content but still show up properly then you can try changing the width to 730px.

    Or you could decrease the sidebar width if you wanted to keep the width of the Content. Just make sure you calculate the width of the Content, Sidebar and the padding that was added around both of those sections. If they are too wide for the screen, then the sidebar will fall off to the side.

    This is what happens when divs are set at a fixed width. When the responsive CSS kicks in it either decreases the fixed width or changes the width into a percentage so they can adjust with the browser.

    Let me know if that fixes it.

    September 25, 2017 at 2:53 pm #21968
    jamesc8913
    Customer

    Thank you so much Wes!

    September 25, 2017 at 4:02 pm #21969
    Wes
    Moderator

    You’re Welcome!

    Oh, and let me know when the site is ready so I can share the link on Twitter, FB, etc.

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.