How to shift the product collection heading to the centre in the mobile and with its content?

Shopify Discussion
, , ,
1

image
image2525×265 21.4 KB

2

Could you share the link to your collection page?

3

Hi,

Hope this will help

  • Add custom CSS targeting mobile screens (max-width: 749px)

CSS example (at theme.scss.liquid)

/* Center collection title & subtitle on mobile */
@media only screen and (max-width: 749px) {
  .collection-hero__title,
  .collection-hero__description,
  .section-header__title,
  .section-header__subtitle {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block;
  }
}
  • Use text-align: center, margin-left or right: auto
4

Which theme are you using?