Grid Row Stacking & Spacing – Mobile

Hey accurIT,

The easiest way to achieve this would be using custom css and adding a class name to the element or column whose margins you like to be different on mobile.

To do so please perform the below steps:

1. Please enable the custom css class field: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

2. Give the elements or columns a custom class name of “mobile-margin”.

3. Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

@media only screen and (max-width:767px) {
	.mobile-margin {
		margin-top:60px!important;
		margin-bottom:60px!important;
	}
}

Best regards,
Vinay

Hi,

Try adding this css code in Quick CSS:

@media only screen and (max-width:767px) { 
  #business {
    display: flex;
    flex-direction: column-reverse;
  }
}

Hope this helps.

Best regards,
Nikko

Hi,

Best regards,
Jordan Shannon