Primary div width in mobile view too narrow (75%) (4 posts)

  1. welshdemon
    Posted 2 years ago #


    The primary div (centre main content) is set to 75% to allow the right sidebar (secondary div) to fit on the right.

    When viewed in small resolution, the right sidebar/widgets are pushed underneath the main content (which is good) but now the primary div being set at 75% means there is 25% blank space on the right of the screen.

    This causes most noticeable problems for bbpress, as avatars etc take up space on the left of the screen, then the topic content is very small width in the middle of the screen, maybe only a couple of words fit per row!

    it goes
    like this
    quite bad
    and makes
    to read

    If anybody has an idea how I could remedy this, it would be of great help.

    Thank you

  2. Could you provide links to a few specific pages where we can see an example of what you mean?

  3. welshdemon
    Posted 2 years ago #

    If you resize your browser to about 300 pixels you will see what I mean.


    Any post on the forum is the same.


  4. You may want to try adjusting the relative size of the columns in your CSS for smaller screens.

    You can learn more about using media queries that target certain screen sizes here:


    Media queries are a simple concept but powerful in practice, and can take some experimentation and testing to get right.

    Don't edit the theme files directly, otherwise your changes will be overwritten when the theme is updated.

    An easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You'll then add your custom CSS in the new stylesheet editor that'll appear in your dashboard, under Appearance > Edit CSS.

    As alternatives, you could either install a standalone custom CSS plugin, or create a child theme.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic


No tags yet.