WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Mobile site width (5 posts)

  1. thestylistquo
    Member
    Posted 6 months ago #

    I've tried and tried to fix this but to no avail. I'm running a child theme of Twenty Twelve, which I recently reinstalled and added custom CSS to from the ground up. I tried to make sure to avoid using set-values for changing the body and sidebar width, as I'd read that can interfere with the responsiveness.

    My mobile site is way too narrow, and it's difficult to read my posts/recipes on a smartphone. What can I do to fix this?

    The URL is http://thestylistquo.com. Thanks.

  2. WPyogi
    Volunteer Moderator
    Posted 6 months ago #

    This seems to be the problem:

    .site-content {
        width: 66%;
    }
  3. thestylistquo
    Member
    Posted 6 months ago #

    How do I modify the width of the desktop site whilst allowing the site to remain responsive?

  4. WPyogi
    Volunteer Moderator
    Posted 6 months ago #

    Twentytwelve is coded "mobile-first" so if you want CSS styles to only affect the desktop version, use media queries - you can look on about line 1350 in the parent style.css file for how those are set up. The first section applies to bigger browser with this - I added your code here as an example - though presumably you have the sidebar to put there too?

    /* Minimum width of 600 pixels. */
    @media screen and (min-width: 600px) {
    
        .site-content {
             width: 66%;
        }
    
    }
  5. thestylistquo
    Member
    Posted 6 months ago #

    Thank you! Perfect explanation and perfect solution. My mobile experience is infinitely improved now. Now to figure out Doubleclick for Publishers.. sigh. Thanks again!

Reply

You must log in to post.

About this Topic