My Design in Cornerstone doesn't look like my published Page - Spacing issues

Support
#1

Hello,
In Cornerstone, I have used custom CSS to place the rows right on top of each other. No spacing between. It looks correct in Cornerstone but when I go to see the preview the spaces are there. Can you pls let me know what I can do thanks. Page post: https://www.gratitudespace.com/new-build/

Thanks, Chris

#2

Hi Chris,

Thank you for writing in, that is not a rows right on top of each other, that’s a separate Section, and the space in between that you’re seeing is the Section’s top and bottom padding.

And you don’t really need a custom CSS for that, just add your ROWs in the same Section and that ROWs won’t have space.

Let us know how it goes,
Cheers!

#3

I put all rows in one section. I still have gaps… Is that because the elements are in columns? Please advise and thank you.

#4

Hi @180FitnessChris1,

They are still on separate sections

Perhaps it’s due to cache, for that, please deactivate your cache plugin or feature and test it again.

Thanks!

#5

Think I figured it out, thanks!

#6

new issue. How do I get rid of white space at the top of the page??? Thanks

I put this in the custom: .x-section { margin: 0; padding: 0; column is also all = 0px }
took out the space in Cornerstone but not on live page.

#7

Hi @180FitnessChris1,

That is invalid syntax, please remove that and enable the Advance Mode



If you don’t see that option on your end, please navigate to X > Settings > User Preferences and set the Advance Mode to Always On



With that, you’ll see all the options on the element, including padding.

Hope it helps,
Cheers!

#8

Thank you so much for your help. I’m almost there, I still have a little white at the top. I took the Padding down to 0 for all. Pls help me get rid of the last of the white space. Thanks

#9

Hi @180FitnessChris1,

Please kindly go to the Column settings of the section that you added the Revolution Slider. Then please click the Customize tab of the column and add the code below into the Element CSS option:

.$el.x-col {
    margin-top: 0 !important;
}

You can read more about the Element CSS here.

Thank you.

#10

I added it the the Element CSS in the Column and nothing happened. I added it in the Edit CSS place. Pls advise. Thanks

#11

Hello @180FitnessChris1,

Sorry if the code did not work. There was a typographic error. Have it updated and use this instead:

$el.x-col {
    margin-top: 0 !important;
}

Please let us know if this works out for you.

#12

Thanks, That fixed it!! Much appeciated

#13

You’re most welcome!

#14

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.