Cornerstone mobile vs desktop padding/formatting

Support
#1

Hello

I am building a splash page in cornerstone and everything looks fantastic on desktop but some of the elements have too much space between them on mobile.

You can see what I mean at the link below where the menu text after the baby has a large gap

http://bedstuyloveaffair.us/wordpressdemo/

Is there anything I can do in order to decrease the space between these elements but only when viewed on a mobile device and preserve the current padding on desktop os?

Thanks so much!

#2

Hi There,

Thank you for writing in, you added a huge top padding (200px) to your 1/5 column (where you place the menu text is). I advice you refrain from using this size of padding as this will cause more bad spacing than good.

For now you can add a CLASS to the said 1/5 column and then add this on your custom CSS.

@media (max-width: 767px) {
	.your-column-class {
		padding-top: 0 !important; 
	}
}

Replace the your-column-class with the actual class name that you applied.
This should reset the 1/5 column top padding to 0, when viewed on 767px screen and below.

The remaining space is from your image, as you can see it has a natural space below it.

Cheers!