How to prevent elements moving when browser window is resized

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #3156 Reply

    John Murray

    Hi,

    I’ve recently installed the Frontier theme and I’d like to try to fix everything in place on the page, so that the content doesn’t shift when the browser window is resized.

    The sidebars currently move when the window is resized and overshoot the footer.

    I’ve not found any options that facilitate fixing this directly and imagine I would need to use the styles editor somehow.

    Any assistance would be greatly appreciated.

    Thanks, John

    #3157 Reply

    Ron
    Keymaster

    Add this on the custom css option.

    #container {
        max-width: none;
    }
    #3161 Reply

    Anonymous

    Thanks for the quick response Ron.

    I tried adding the commands but it is still the same if you reduce the window size.

    In mobiles the problem is especially apparent, the sidebars are placed below the content.

    #3162 Reply

    Anonymous

    I should add that for the majority of users, the website will show up fine on a PC with a decent sized screen so it’s not too much of problem there, only for those viewing with a small screen such as a mobile device.

    #3163 Reply

    Ron
    Keymaster

    In mobiles the problem is especially apparent, the sidebars are placed below the content.

    As stated on the theme’s description, it is a responsive theme. Which means it will adapt to different screen sizes. When viewed on devices with smaller screens, the sidebars go under the content. That is the desired effect on most responsive themes.

    If you really want to prevent that then in addition to the code above you’ll have to delete all the css codes located on the bottom of style.css which starts with this line.

    /*-------------------------------------
       Responsive Properties
    --------------------------------------*/
    @media screen and (max-width:800px){
    ...

    Maybe I’ll just add a new option to for this on the next update.

    #3166 Reply

    Ron
    Keymaster

    A new option has now been added to Frontier 1.0.5 that will disable this behavior. No more need to delete css as described above.

    #3178 Reply

    Anonymous

    Just updated now and ticked the check-box – it works perfectly !

    Thanks very much Ron.

Viewing 7 posts - 1 through 7 (of 7 total)
Reply To: How to prevent elements moving when browser window is resized
Your information: