[Resolved] Curved Corners

[Leo]

Ok thanks for the screenshot and let’s give it another shot:

To add space between the navigation and the content, try this CSS:

.container.grid-container {
    margin-top: 7px;
}

To change the background color, go to Customizer > Colors > Content > Background. If you want to keep the content/text section white, then add this additional CSS:

.one-container .inside-article {
    background-color: #ffffff;
}

Let me know.

[Gary L]

Hi,

The first block of code didn’t close the gap.. I tried 0px but still didn’t work.
The second block didn’t seem to do anything.

Here is the pic of the model site I’m copying

Model Site

Here’s a pic of the copy site that is being built with generate press

Copy Site

Notice in the model site that the .container.grid-container appears to be up against the primary menu, that is what I’m trying to achieve. Also notice the light brown area between the page content, that background is what I’m trying to achieve. It has a black border around it like the header also. Sorry if I’m being redundant.
my copy site is 7i54.com if you need to look at the code.

Thanks!

[Leo]

ahh I thought you were trying to add in some gap as the picture you provided before already has closed gap.

Try Customizer > Layout > Container > Content Layout > One Container.

Also remove the first block of code I gave before.

The second block of code should work once you set it to layout to one container.

Let me know.

[Gary L]

Hi,
Thanks so much, it’s almost there…see here: almost pic

1. I would like to round the “One Container” like the header and primary menu with the black 2px bar.

2. I can’t remember where the setting is to move the text away from the corner and down some (looked but can’t see it)

3. The widgets inside background I would like to be white like the content area.

Gary

[Leo]

1. Replace the code I provided in https://generatepress.com/forums/topic/curved-corners/#post-264422 with

.site-header, .main-navigation, .widget, .inside-article, .one-container .container {
    border-radius: 20px;
    border: 2px solid #000000;
}

2. Replace the second block of code I provided in https://generatepress.com/forums/topic/curved-corners/page/2/#post-264746 with

.one-container .inside-article {
    background-color: #ffffff;
    padding: 0px 5px;
}

3. Customizer > Colors > Sidebar Widgets > Background

Let me know.

[Gary L]

Double Bingo my brother… works great!!!

while I have you, my spacing feature is turned on in the GP Premium but I can’t find it in the customizer, where is it hiding?

Thanks so much!!

[Leo]

All the Spacing options are actually added in Customizer > Layout inside their respective sections.

https://docs.generatepress.com/article/spacing-overview/

Hope this helps!

[Gary L]

Hi..I saw the spacing options, I guess I’m using the wrong terminology. It seems when I first started with the customizer I was able to move the text around within the page content like you did with padding in number 2 above:

.one-container .inside-article {

>>> padding: 0px 5px;

Maybe I was moving something else and it just looked like the text was moving away from the corners. Your code did the trick but I thought there was a customizer setting that did this also.

Thanks

[Leo]

No that option isn’t currently available. You are probably thinking about the Content Padding setting in Customizer > Layout > Contain which moves the entire inside box away from the ourside box.

[Author]

Posts