[Resolved] Creating Separate Sections Using CSS

[Clyde]

I’m working on a page using Sections. It currently has 4 sections:
https://fluxresearch.com/clyde-smith-freelance-writing-services/

I would like each section to be separated by a margin with the dark grey background color from the page visible. This would look like the blog excerpts on my home page:
https://fluxresearch.com/

I tried doing what was recommended in this earlier topic:
https://generatepress.com/forums/topic/need-help-with-page-sections/

I added this Additional CSS via the Customizer:
.section-margin {
margin-bottom: 20px;
}

I also added the related class in Custom Classes for each of the 4 Sections:
section-margin

However that doesn’t seem to be doing anything.

How can I make this happen?

Thanks!

[Leo]

Hi Clyde,

Can you try the exact code in this post?
https://generatepress.com/forums/topic/need-help-with-page-sections/#post-276073

Shouldn’t need to add anything to the Custom Classes field as well.

Let me know.

[Clyde]

It does work except for one thing.

I’d like the top margin of the first section to be parallel to the top margin of the sidebar like it is on the home page.

Any way to do that?

Thanks!

[Leo]

Add this addtional CSS:

#generate-section-1 {
    margin-top: 0;
}

Let me know.

[Clyde]

That did the trick.

Thanks!

[Leo]

No problem 🙂

[Author]

Posts