move item to center of the page

Hi, can anyone help me move this item to the middle of the line ?
it has a minimum of 2 so there is actually an empty one on the left which i can’t get rid of:

https://a700ea-98.myshopify.com/

Daniel19901_0-1722946318574.png

  • Here is the solution for you @Daniel19901
  • Please follow these steps:

  • Then find the base.css or theme.css file.
  • Then add the following code at the end of the file and press ‘Save’ to save it.
@media screen and (min-width: 768px) {
    .multicolumn.card-grid.card-grid--2 {
        --card-grid-per-row: 1 !important;
    }
}
  • Here is the result you will achieve:

  • Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.

@Daniel19901 - please add this css to the very end of your theme.css file and check,
Shopify Admin → Online Store ->Theme → Edit code → theme.css

@media screen and (min-width: 768px) {
    .card-grid--2 {
        --card-grid-per-row: 1;
    }
}

Hello @Daniel19901
Go to online store ---------> themes --------------> actions ------> edit code------->theme.css ----> line number 9030
search this code

@media screen and (min-width: 768px) {
.card-grid--2 {
--card-grid-per-row: 2;
}
}

and repalce with this code

@media screen and (min-width: 768px) {
.card-grid--2 {
--card-grid-per-row: 1 !important;
}
}

result

If this was helpful, hit the like button and accept the solution.
Thanks