Section alignment help needed

Just need a bit of advice on lining up the bottom section. Need to move it over to the right a bit so it lines up with the section above. These sections only show up in mobile view.

The section has a class set called .stay-inline-2 and the code is as follows;
/create 2 inline columns on moble/
@media (max-width: 767px) { .stay-inline-2 .x-column.x-sm { float: left; width: 46%; margin-right: 4%; } .stay-inline .x-column.x-sm:last-child { margin-right: 0; } }

I have tried adjusting the margin-right: 4% but did not get any results. Can you give me a clue as to what the right dimensions should be? thanks.

Hello There,

Thanks for writing in! To resolve your issue, please update your code and use this instead:

/*create 2 inline columns on moble*/
@media (max-width: 767px) { 
    .stay-inline-2 .x-container.max {
        padding-left: 20px;
        padding-right: 20px;
    }

	.stay-inline-2 .x-column.x-sm { 
		float: left; 
		width: 48%; 
		margin-right: 4%; 
	} 
	
	.stay-inline-2 .x-column.x-sm:nth-child(2n),
	.stay-inline-2 .x-column.x-sm:last-child { 
		margin-right: 0; 
	} 
}

Please let us know how it goes.

thanks very much for that, it worked perfectly!

On behalf of my colleague, you’re welcome. Cheers! :slight_smile:

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