Changing Image Banner Text Font On Mobile Only Please Help

[InnHaus]

Would anyone be able to help me with the code to change the size of the text in the image banner on the mobile view?  i need it to be smaller so the button and text can fit on the image banner for mobile. I have attached a preview link of the website below that will expire in 2 days.

Link - https://r6upc4avborujmcu-71948271909.shopifypreview.com

[PageFly-Henry · Accepted solution]

Hi @InnHaus 

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

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

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

@media (max-width: 767px){

.banner__heading strong {

    font-size: 18px !important;

}

h2.banner__heading.inline-richtext.h1 {

    margin-top: 80px !important;

}}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[InnHaus]

Hi,

Would it be in the base.css file? If so i have just tried this and it didnt make the image benner text any smaller on mobile view.

[PageFly-Henry]

Yes, I think it works fine in base.css file. Or you can add this to Theme.liquid

[InnHaus]

Hi, I tried this again but it didn't work in Theme.liquid. On the second try of posting in the base.css file it actually worked! Thank you a lot for this im so happy to finally have it sorted.

[PageFly-Henry]

You are welcome @InnHaus 😉