Multicolumn on mobile: reduce small size & line spacing (dawn theme)

[10xfuel]

Hi! Multicolumn on www.10xfuel.com mobile only (desktop looks great!): how can I:
- reduce font sizes of the headings
- reduce line spacing of descriptions

Thx!

[suyash1 · Accepted solution]

@10xfuel - please add this css to the very end of your base.css file and check

@media screen and (max-width:749px){
.multicolumn-card.content-container h3{font-size: 22px !important;}
.multicolumn-card.content-container p{font-size: 20px !important; line-height: 24px;}
}

[suyash1 · Accepted solution]

@10xfuel - please add this css to the very end of your base.css file and check

@media screen and (max-width:749px){
.multicolumn-card.content-container h3{font-size: 22px !important;}
.multicolumn-card.content-container p{font-size: 20px !important; line-height: 24px;}
}

[PageFly-Henry · Accepted solution]

Hi @10xfuel 

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){

.multicolumn.color-accent-1.gradient.background-none.no-heading h3 {

    font-size: 25px !important;

}

.multicolumn.color-accent-1.gradient.background-none.no-heading p {

   line-height: 25px !important;

}}

Hope that my solution works for you.

Best regards,

Henry | PageFly