Align section to the left

[collins276]

Hi everybody,

Can you help me to move Featured Products to the left in order to align with other sections.

Please visit my url: https://189ee3-2.myshopify.com/ 

Thank you,

[theycallmemakka]

Hi @collins276 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

<style>
@media screen and (min-width: 990px){
    .slider--desktop .slider__slide:first-child {
        margin-left: 6rem;        
    }
}
</style>

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

[collins276]

Thank you, but the are still not align. I gonna check my page width.

[theycallmemakka · Accepted solution]

Can you try adding this CSS.

<style>

@media screen and (min-width: 750px){
    slider-component.slider-mobile-gutter.slider-component-desktop {
        max-width: 1200px !important;        
    }
    .slider--desktop .slider__slide:first-child {
        margin-left: 0rem !important;
    }
    
    slider-component.slider-mobile-gutter.slider-component-desktop {
        max-width: var(--page-width);
        margin: 0 auto;
    }
}
</style>

[collins276]

Thank you so much. But I'd like the Third image to be align with other section (because it's carousel so the max-width is 100vw, not 1200px)

Like in this page,  https://189ee3-2.myshopify.com/collections/all#MainContent the first three images fit perfectly