Gaps on home page

Hi

How do you delete the gaps on the home page for Rocked theme please? I just want the front page to flow please.

Somehow the 2nd call to action is no longer underneath the skills and about us text. In the demo it has no gap.

My website is www.ccsecretarialservices.com.au

Thanks
Danielle

Hello Danielle,

Please try to use the following CSS code to delete the gaps on your home page.

You can add CSS code to your site with Simple Custom CSS plugin (just copy CSS code and paste it in Dashboard -> Appearance -> Custom CSS after installing and activating the plugin). Also you can add CSS code directly to style.css file of your child theme.

#pg-220-0 {
    margin-bottom: 0 !important;
}

#pg-220-0 .siteorigin-panels-stretch.rocked-stretch.panel-row-style {
    padding-bottom: 0 !important;
}

#pg-220-2 .siteorigin-panels-stretch.rocked-stretch.panel-row-style {
    padding-top: 0 !important;
}

#panel-220-4-0-2 {
    margin-bottom: 0 !important;
}

#panel-220-4-0-3 h3.widget-title {
    padding-top: 50px !important;
}

#pg-220-4 .siteorigin-panels-stretch.rocked-stretch.panel-row-style {
    padding-bottom: 0 !important;
}

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.

Hi

Thanks for that. Most of it did work, however, there is still a gap between:

Our Work and the Testimonials
Testimonials and Our Clients
Latest News and the bottom footer

Thanks
Danielle

Okay Danielle,

Please try to add this:

#pg-220-2 .siteorigin-panels-stretch.rocked-stretch.panel-row-style {
    padding-bottom: 0 !important;
}

#pg-220-4 .siteorigin-panels-stretch.rocked-stretch.panel-row-style {
    padding-top: 0 !important;
}

#pg-220-3 {
    margin-bottom: 0 !important;
}

#pg-220-1 {
    margin-bottom: 0 !important;
}

Also please try to add bottom padding in row settings to the row that contains Latest News to prevent button to be on the edge.

Kind Regards, Roman.

Hi

Thanks for that. The coding worked.

In regard to the padding. I added 20px, however because I have a background colour behind latest news, it shows the white gap. Is it possible to add that colour to the gaps?

And for some reason, it isn’t stretching across the whole page.

Thanks
Dani

Hello Danielle,

Please use this CSS code to expand background color of Latest News widget:

#pg-220-5 .siteorigin-panels-stretch.rocked-stretch.panel-row-style {
    background: rgb(239, 239, 239);
}

However, you will have to remove some padding that you added.

Kind Regards, Roman.

Hi Roman

Thanks that worked. I added the Latest News widget underneath the call to action widget to reduce the white space, however, now the latest news button is sitting on the footer. I tried to add bottom padding to the row but it didn’t work.

Should I put Latest News on its own row and then add padding? If yes, what is the coding to reduce the white space between the call to action and latest news?

Thanks
Dani

Hi Dani,

All you have to do is to apply this CSS code:

#panel-220-4-0-3 .panel-widget-style {
    padding-bottom: 30px;
}

Kind Regards, Roman.

Hi Roman

I’ve applied the codes above, however for some reason, my 2nd call to action has been moved and is no longer attached to the skills and there is also a gap between the 2nd call to action and testimonials.

What is the code to fix this please?

My website is www.ccsecretarialservices.com.au

Thanks
Danielle

Hello Danielle,

Please try this:

#panel-220-1-1-0 {
    margin-bottom: 0 !important;
}

#pg-220-2 {
    margin-bottom: 0;
}

Kind Regards, Roman.

Hi Roman

That has worked but for some reason it has closed the gap between the News and the Footer. Why did it overight this?

There is still a gap between 2nd call to action and the Testimonials.

Thanks
Danielle

Hello Danielle,

Please remove this custom CSS rule:

#panel-220-4-0-3 .panel-widget-style {
    padding-bottom: 0 !important;
}

And replace this:

#pg-220-2 {
    margin-bottom: 0;
}

…with this:

#pg-220-2 {
    margin-bottom: 0 !important;
}

Kind Regards, Roman.

Thanks

You are welcome Danielle,

Kind Regards, Roman.