how to center all section headers in mobile view? DAWN THEME

[justauser]

In the mobile view, I would like to center all my section headings. How do I achieve this? Any help or sources are much appreciated.

Please refer to the picture below for clarification, all the heading in the desktop view is centered but in the mobile view its all left aligned

URL: Abbasi (abbasigems.com)

Thank you

[suyash1]

@justauser add this css to the very end of your base.css file and check

@media screen and (max-width:749px){
.collage-wrapper-title, .collection__title{text-align: center;}
}

[PageFly-Victor]

HI @justauser

This is PageFly - Advanced Page Builder.

You can try with this code:

Follow this:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css.

Step 3: paste below code in bottom of file → save.

@media screen and (max-width: 767px){

.collection__title.title-wrapper, .collage-wrapper-title {

text-align: center !important;

}

}

Hope that my solution works for you.

Best regards,

PageFly

[justauser]

Hi @PageFly-Victor , your solution works on the inspect element console but when I tried that in the shopify code panel it is not working at all, by the way, this is the code block I am using

.collage-wrapper-title, .collection__title h2{
    text-align: center !important;
    font-size: 1.7rem !important;
}

@media screen and (max-width:747px){
  .collage-wrapper-title, .collection__title h2{
    text-align: center !important;
  }

any idea why?

[justauser]

@suyash1 Hello, Thank you for responding

I tried your code block but it is not working in the shopify code base, but it does work in the inspect element tool set, any idea why?

By the way this is the code block I am using in shopify

.collage-wrapper-title, .collection__title h2{
    text-align: center !important;
    font-size: 1.7rem !important;
}

@media screen and (max-width:767px){
  .collage-wrapper-title, .collection__title h2{
    text-align: center !important;
  }

[suyash1]

Then may be issue is not with this case but CSS before it has issues like
missing ; or }

[ExpertRookie]

Hi @justauser
your case has the same problem like this topic:
https://community.shopify.com/topic/1804953

[LeaK]

Hello, How can I adjust the title and the button send on the contact form in mobile version to be centrally aligned. I am using the dawn version. Thank you in advance.