How to make rich text smaller in the mobile version?

[Tinctoria]

I want to change the font size of my rich text sections, and make the text smaller (ONLY for the mobile version).

Here is my website link for reference: https://0a272e-93.myshopify.com/

what code can i apply to do this? (preferably something to add to the theme.liquid file

[niraj_patel · Accepted solution]

Hello @Tinctoria 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>

@media screen and (max-width: 767px) {
   .rich-text-description p {
         font-size: 14px !important;
    }

    #shopify-section-template--17174517579942__rich_text_9Yd4ag .rich-text-description{

        padding: 0 !important;
        max-width: 100% !important;

   }

}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[BSS-TekLabs]

- Here is the solution for you @Tinctoria 
- Please follow these steps:

- Then find the base.css or theme.css or theme.min.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

@media only screen and (max-width: 600px) {
.rich-text-content .content-heading {
 font-size: 22px !important;
}
.rich-text-content .rich-text-description p{
 font-size: 14px !important;
}
.rich-text-description {
 padding: 5% !important;
}
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.