What's your biggest current challenge? Have your say in Community Polls along the right column.

Help with Oversized Text and Buttons on Mobile – Dawn Theme 15.0.2

Solved

Help with Oversized Text and Buttons on Mobile – Dawn Theme 15.0.2

Sohayl67
Explorer
89 0 21

Hello ,

I have an issue with The heading and subheading on my slides , these titles on my slides are too big for the mobile version but it's perfect on desktop . I just want to know how to modify modify the  heading and subheading of my slides on the mobile version only so that it's smaller and it's sizes can be more adapted to mobile and the slides ...

I thank you in advance for you response

Accepted Solution (1)

DaisyVo
Shopify Partner
1055 134 147

This is an accepted solution.

Hi @Sohayl67 

To modify the heading and subheading size for mobile on your slides, you can add custom CSS that targets only mobile devices. Here’s an example:

  1. Go to Online Store > Themes > Actions > Edit Code.
  2. In the Assets folder, open theme.scss.liquid or styles.css.liquid.
  3. Add this CSS at the bottom:

@media (max-width: 768px) {

   .slide-heading, .slide-subheading {

      font-size: 20px; /* Adjust this size as needed */

   }

}

 

This will apply smaller font sizes to the headings and subheadings on mobile devices. Adjust the font size according to your preference.

 

If you have other questions, I am willing to answer them more.

 

Best regards,

Daisy

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Avada SEO & Image Optimizer - The #1 SEO solution

View solution in original post

Reply 1 (1)

DaisyVo
Shopify Partner
1055 134 147

This is an accepted solution.

Hi @Sohayl67 

To modify the heading and subheading size for mobile on your slides, you can add custom CSS that targets only mobile devices. Here’s an example:

  1. Go to Online Store > Themes > Actions > Edit Code.
  2. In the Assets folder, open theme.scss.liquid or styles.css.liquid.
  3. Add this CSS at the bottom:

@media (max-width: 768px) {

   .slide-heading, .slide-subheading {

      font-size: 20px; /* Adjust this size as needed */

   }

}

 

This will apply smaller font sizes to the headings and subheadings on mobile devices. Adjust the font size according to your preference.

 

If you have other questions, I am willing to answer them more.

 

Best regards,

Daisy

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Avada SEO & Image Optimizer - The #1 SEO solution