CSS to Eliminate Page Margins

Hey folks!

On one of my sites I have the Courses & Lessons add-on by Paid Memberships Pro plugin. These post types (courses and lessons) doesn’t allow me to eliminate the margins on both sides of the content.

Would there be some special CSS that could make all sections on those pages (courses and lessons) to be page-wide width?

Thank you very much in advance, cheers!

Hi @fabiofava,

Thanks for reaching out.
You can uncheck the Global Container option and set the width and max width to 100% for the Row as shown in the given screenshots.

image

Hope it helps.
Thanks

Hey @tristup thank you for your help.

Unfortunatelly it didn’t work. I’d need some settings for the Section, not the Row. The way you suggested, it splits the section “per row” inside a same section, it didn’t work this way.

I’d need some section settings, wich I couldn’t find anywhere on the Cornerstone interface.

I actually feel that I need some CSS to add to those lessons, forcing all sections to use full width. I can’t see how to achieve that only via the interface of Cornerstone.

I’ll keep looking forward on that, thank you so much!

Hi @fabiofava,

The Section does not have such an option, as the width is set to the Row element, the option to change is available on that only. Alternatively, you can increase the width globally from Theme Options > Layout and Design, but in that case, it will affect all the existing pages.
Please remember custom CSS is beyond the scope of Theme Support, I would suggest you hire a developer who can assist you in doing the customization or you can avail of our newly launched service called One, where we answer the questions beyond normal theme support.

Thanks

Thank you @tristup

I plan to get One when I have enough clients to be able to pay fo that. For now it’s just one or other question now and then, and most of my sites are personal so there’s no revenue.

Anyway if you or some other supporter could give me some direction, I don’t think it’s a very hard CSS to create, it happens that I’m really that bad on writing code.

Thank you very much and best regards

Hey @fabiofava,

Would you mind providing the page where you need to reduce the spacing so that we can check it out and guide you to be able to resolve your current issue? We would be happy to double check your site if we can log in. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

image

Best Regards.

Hey @ruenel

I’ve prepared the support user account to send you the data, will follow in a secure note.

In case you manage to do it within Cornerstone, you can do one section and let me know how-to, so I can learn and do the others…

You can do it on Lesson 5 (last link on the secure note), since it have colorfull sections, and there it will make the difference. Thank you very uch once more

Cheers!

Hello @fabiofava,

The custom post type lessons and course contents has been wrapped with the container .x-container. To get your issue resolve, check out the responds of @Thai on this thread:

He suggested this CSS code:

.single-x-portfolio .x-container.max.width.offset {
    width: 100%;
    max-width: 100%;
}

You will have to substitute x-portfolio with pmro_lesson and/or pmpro_course. Thus, you will have something like:

.single-pmpro_lesson .x-container.max.width.offset,
.single-pmpro_course .x-container.max.width.offset {
    width: 100%;
    max-width: 100%;
}

Be advised that custom CSS coding is beyond the scope of our support under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One service for further assistance.

The code above serves as an example code. Feel free to modify it when needed. Please note that custom coding is beyond the scope of our support. You must maintain any custom coding to ensure it will still work after any updates or does not create any issues or incompatibility in the future.

Kindly let us know how it goes.

Hey @ruenel thank you for the code!

Just happens that the contents “out of the sections” (on very top and very bottom of the Lesson page) got attached to the left of the page.

I’d need the width and max-widht at 100% on the sections only. This way this content at top and bottom of the page would have their regular width and max-width.

Do you think we can find a solution for that?

Thank you SO much! Cheers!

Hello @fabiofava,

You cannot make the Section width 100% or same width with the browser if the container wrapper is not 100%. You will need the CSS code above and modify the maximum width of the container of the top and bottom DIV elements. Using your browser’s Development Tool, you can check the live HTML code and find which CSS selector you need to use or what CSS code has been used to style the page.

Check out this video demonstration:
https://www.youtube.com/watch?v=EY3CCMWD67o

You will have something like this:

The x-container max width offset is the parent container. We have used this class in the CSS code above.

So, you will need another CSS block which targets the entry-header and set the width to at least 88% only, maximum width of 1200px and include a margin left/right to auto to make sure it is in the middle.

Be advised that custom coding is beyond the scope of our support under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One service for further assistance.

Cheers.

Hey @ruenel thank you again for your effort.

I’m very bad at this Console and I’m a very very bad on coding. I’ve passed these infos to the plugin developers support, and I hope they can help me from here. I’ll just kindly ask you folks to keep this topic open a bit more, just until I conclude the solution.

Then I can post it here so other users can bennefit from this relevant information.

Thank you very much once more and best regards

You are most welcome, @fabiofava.

PS:
The thread will close down 10 days after the last response.

Thank you @ruenel

Anyway, if you find it easy to help me (what is impossible for me to do by myself), please feel free to do it. I’ll be forever grateful, as I’m already for so many relevant help you and your fellow supporters has already given me.

Please note that at some point (when I reach a certain numer of clients and can afford it) I’ll hire the One Service for sure: I find it amazing, it’s just some montly cost I can’t yet commit to. But I will, please don’t have any doubt on that.

I’l keep looking forward, on the hope you have a spare hour and can allocate it to help this non-coder to succeed once more. I love Pro and you all, Pros!

Cheers

Hey @fabiofava,

We love to help however, if we provide help outside of One here, other customers will also ask for free help and the forum will be flooded with customization request which we are avoiding as that will be bad both for all our customers because response times will be longer and for the support team to be overwhelmed.

Thank you for understanding.

Hey @christian

Totally understand and totally agree with your point!

Cheers!

No problem, @Fabiofava.

Hey @ruenel,

I just need a few more clients to “break even”, so a few after that I’ll definitely hire One Service, you folks rock with fast replies, solutions that work and the many years I’m with you matter a lot to me.

All my best wishes!

No problem, @fabiofava.
Hope to hear from you with our ONE Service anytime soon.

Thank you @ruenel! You guys are the best! I’m working for that! Cheers!

Always happy to help.