Browser Auto Resizing Twenty Twelve Child Theme

  • Hi,

    I am creating a website using the a child theme on the Twenty Twelve theme and have noticed that when I resize the browser window certain elements seem to move about and the site just looks a mess on mobile devices.

    I want my site to resize with the browser window but I would like the the sidebar with the widgets on to be fixed in place on the left side. I would like the main page and container resizing to fit the the browser window as it resizes. I have even found that the columns on the ‘about’ page shift when the browser is resized.

    Any suggestions on how to fix this would be much appreciated.

    Website: https://www.alexbradbury.co.uk

    Here is an example of the functionality I am looking to achieve:

    https://kopkoimages.com

    Many thanks.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    but I would like the the sidebar with the widgets on to be fixed in place on the left side

    Then why have you floated it right?

    Thread Starter A_Bradbury

    (@a_bradbury)

    Yeah I have just taken that bit out. I am new to CSS and only know the basics I’m afraid – hence I’m asking for some pointers here…

    I have done research into this but have been unable to find the answer to what I’m looking for so far. It seems that it could be down to the responsive theme?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Have you cleared your browser’s cache after you made the CSS change?

    Thread Starter A_Bradbury

    (@a_bradbury)

    I have, yes.

    Tried fixing the position of the sidebar using ‘position: fixed’ but the site content moves over the top of it when resized…

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I can no longer experience the issue that the sidebar is not on the left side – when I resize the browser. It looks like you resolved this. Which browser & browser version is the issue still occurring in?

    Thread Starter A_Bradbury

    (@a_bradbury)

    Sorry, I’m guess I’m not explaining this clearly enough.

    The sidebar stays on the left but when the browser window is made smaller the main content area overlaps the sidebar and looks messy. Then, when the browser window gets even smaller the sidebar disappears all together.

    The columns on the ‘about’ and ‘contact’ pages also move one on top of the other when the browser window is made smaller.

    What I would like is for this main content area and the surrounding container to fit the browser window until it gets to a certain smaller size then it stops resizing.

    When viewing the site on a mobile device the elements are all over the place…

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Browser Auto Resizing Twenty Twelve Child Theme’ is closed to new replies.