Support » Theme: Argent » Changing content width on Argent theme page

  • JohnX

    (@xbootenk)


    I found this works. Thanks to mayakutis (@mayakutis)

    I figured it out by pasting the following code into the Appearance/Custom CSS box:

    .single-jetpack-portfolio .entry-header, .page-header, .single-jetpack-portfolio .entry-content, .page-content, .page .entry-meta, .single-jetpack-portfolio .entry-meta, .comments-area, .post-navigation, .posts-navigation {
    margin-right: auto;
    margin-left: auto;
    width: 1000px;
    }

    I just swapped out the default width of 660px with my desired width. Hope that helps others 🙂

Viewing 7 replies - 1 through 7 (of 7 total)
  • KokkieH

    (@kokkieh)

    Hi there,

    Just to be clear, you’re not asking for help on doing something, just sharing a solution that worked for you? Or is this related to an earlier thread you’d started?

    JohnX

    (@xbootenk)

    I’m sharing a previous solution.

    I spend days trying to figure out why all my pages had a left margin of about 25% of the screen width. I had been playing around with page width in Custom CSS so I first deleted all the CSS I had added. No joy.

    It seemed Theme related; when I switched themes the problem went away. But I like the Argent Theme. Then I searched all the stylesheets in my theme and in all my plugins to no avail (the documentation inside the stylesheets is minimal to non-existent). I googled and searched every combination of search terms before eventually stumbling on mayakutis’ post here. That fixed the problem.

    Since the fix involved JetPack, I deactivated JetPack, commented out the fix. and LO! the pages continued to display as I wanted. My guess is that I inadvertently activated JetPack during the flood of plugin upgrades that arrived with 5.0. I don’t need JetPack so I deleted it. End of a frustrating period…

    KokkieH

    (@kokkieh)

    Hmm, I see no difference in the content area width or page margins on a test site with this theme with Jetpack active vs deactivated, so I’m not sure that’s the cause of whatever you were experiencing.

    This theme has a fixed content-width on posts, pages and porfolios of 660px on desktop screens, so some amount of white space on either side is intentional, and whether or not Jetpack is connected has no effect on that – it’s coded into the theme’s style.css file, lines 1336 and 1349 for pages and portfolios, and posts respectively.

    The CSS code you posted above overrides that CSS rule present in line 1336.

    If you’re happy with things as they are, then it’s fine, but if you’d like us to look into this some more it would help if I can see the issue in action on your site, because I’m unable to replicate anything like what you’re describing on my end.

    yak2by2

    (@yak2by2)

    xbootenk, what is your url? i’d like to preview it before trying to make this same switch on mine. has it messed up the mobile version at all? (does all the text fit on the phone screen or does the text go too wide?)

    I took the drastic step of deleting all the custom CSS including from the plugins and rebuilt from there. I found on plugin that I had forgotten I had added CSS to. That took care of the problem…

    @kokkieh, how do I make my width wider while keeping the mobile display responsive to this change? When I widened the width in my CSS to my liking for the desktop, it spilled the text off the screen on mobile.

    @@xbootenk, Thanks for letting us know the cause 🙂

    @yak2by2, can you please give me a link to your site and tell me what CSS code you have added already? Then I can take a look. Likely you need to add a @media query to the CSS to only apply it to certain screen sizes.

    It might be better if you start your own thread so we don’t keep on hitting @xbootenk with email notifications 🙂 Our team is notified of all new threads created in this theme forum so we’ll see it, though given the holidays it might be a few days before one of us can reply.

Viewing 7 replies - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.