Pages have zero left and right margin – Content too wide?

  • Resolved webdad2000

    (@webdad2000)


    5 years, 1 month ago

    This page is indicative of what I’ve been trying to resolve after moving my site to the Storefront theme in preparation for a wooCommerce go live.

    I’ve addressed a number of pages (Cart, archive, and a few others) through using Elementor Pro and creating two columns with the sidebar on the right with a 10px padding on left and right. Ultimately I don’t want the content running all the way tot the edge of the window. I’ve seen some discussion of content width but haven’t been able to find the solution. Here is an example of a page I “fixed” – https://www.storeallthebits.com/site/where-are-they-now

    Some of the edits I’ve done by using the shortcode inside an Elementor page configured like the above.

    I’m trying to find where I can fix this for the site, as opposed to playing whack a mole with pages as I come upon them.

    Any help would be appreciated.

    • This topic was modified 5 years, 1 month ago by webdad2000.

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

  • The content-area div is floated left which is why it is all the way up against the left side of the browser window. Try this in Appearance->Customize->Additional CSS

    .page .site-main {
    margin-left: 130px;
}

    I think it’ll get you what you’re looking for if I understand correctly.

    Thread Starter webdad2000

    (@webdad2000)

    Thank you! That worked wonderfully. I’d like to fix the right margin, but in looking online that seems like it might be a little more complicated than I want to take on for now. Getting the left side cleaned up is great!

    Thanks again.

    Hmm the right margin should be relatively simple as well I would think, do you have an example page on the domain showing the issue?

    Thread Starter webdad2000

    (@webdad2000)

    so I put this in the additional CSS

    .page .site-main {
    margin-left: 130px;
	  margin-right: 130px;
}

    You can look at the same page I had originally, and see the right side isn’t changed much if at all.

    Are you talking about the sidebar and not the area where the content is? I think so, if so try this

    #secondary.widget-area {
    padding-right: 30px;
}
    Thread Starter webdad2000

    (@webdad2000)

    That’s it!

    Thank you so much!

    Really appreciate the help.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Pages have zero left and right margin – Content too wide?’ is closed to new replies.