Move a collection list to the center on home page- Debut theme

Solved
Highlighted
Excursionist
32 0 7

Hello, I recently added a collection list section on my home page that only composite of two collections.

It didn't appear in the center of the home page, This is my URL: https://presets-market.com/ 

I need to put it in the center as I attached an image to explain what I mean.

A help will be very appreciated! 

Capture.JPG

0 Likes
Highlighted

Success.

Hello @Lilas-addas,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file

.collection-grid .grid.grid--uniform {
	display: inline-flex;
	width: 100%;
}
.collection-grid .grid__item:first-child {
	margin-right: 0 !important;
	margin: 0 auto;
}
.collection-grid .grid__item:last-child {
	margin: 0 auto;
	margin-left: 0;
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
1 Like
Highlighted
Excursionist
32 0 7

Thanks a lot @oscprofessional! it works perfect. But on the mobile it is shifted from the center. Is there any way to make it right in the center in the mobile version?!

Thanks again for the help! 

0 Likes
Highlighted

Success.

@Lilas-addas,

Remove above css and add below css

@media only screen and (min-width: 750px) {
.collection-grid .grid.grid--uniform {
	display: inline-flex;
	width: 100%;
}
.collection-grid .grid__item:first-child {
	margin-right: 0 !important;
	margin: 0 auto;
}
.collection-grid .grid__item:last-child {
	margin: 0 auto;
	margin-left: 0;
}
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
1 Like