Center objects on webpage

[Headlok]

Hello forums,

I am having trouble centering these two products. I removed a product since I am not selling them anymore. How do I center the two remaining products so they are not on the left the screen? Thanks

[Asad-Mahmood]

Go to your online store → edit code → base.css file and paste this code there

@media only screen and (min-width: 990px) and (max-width: 1300px) {
    .section-template--21579314037020__3a88f7e1-f547-4859-8f7b-55e7c65a5b9f-padding .grid {
        justify-content: center;
    }
}

[LizHoang]

Hi Headlok

You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file base.css and add this code at the end of the file

ul#Slider-template--21579314037020__3a88f7e1-f547-4859-8f7b-55e7c65a5b9f {
    justify-content: center !important; 
}

Result:

Best,
Liz

[Headlok]

Thank you both for the responses but for some reason I cannot get it to center on my side. I pasted the code to the bottom of the base.css file. Am I doing something wrong?

[Asad-Mahmood]

you need to paste in the end of base.css file

ul#Slider-template--21579314037020__3a88f7e1-f547-4859-8f7b-55e7c65a5b9f {
    justify-content: center !important;
}

[Headlok]

Pasted the code at the bottom of the base.css file but it doesn’t change anything. Any recommendations?

[Headlok]

Used chatgpt to figure out the problem. added this to the bottom of the base.css file. ul[id^=“Slider-template”] { justify-content: center; } worked perfectly.