How to make font bigger on desktop site

Solved
Andrewpry
Excursionist
23 0 6

How can i make my font headers and body bigger on desktop size and not affect the size when it shows on mobile site 

Accepted Solution (1)

Accepted Solutions
diego_ezfy
Shopify Partner
2313 415 544

This is an accepted solution.

@Andrewpry, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > index.css theme.css and paste this at the bottom of the file:

@media (min-width: 749px){
    .content-overlay__heading{
    font-size: 40px !important;
}

.content-overlay__subheading{
    font-size: 30px !important;
}
}


you can change the values as per your wish:

40px = title
30px = subtitle

Kind regards,
Diego

◦ Slideshow images cutting off or looking bad? Try the Slideshow (PRO) section. No apps required.
◦ Replace apps with copy/paste code snippets & save money. Examples here.

View solution in original post

Replies 4 (4)
dmwwebartisan
Shopify Partner
9829 2237 3078

@Andrewpry 

Please share store URL & screenshot what do you want .

i will check and send correct solution to you .

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
Andrewpry
Excursionist
23 0 6

https://boudoir-sensual.myshopify.com/admin/themes/124785819806/editor?section=163395038396311053

C0D737B6-71AD-41A6-A461-E3B152E8D46A.png

F8BA682F-CDE9-4E84-9807-7EDE80568303.jpeg

 So if you notice the text is quite smaller in the desktop so I want to make it bigger but I don’t want the mobile site text to be bigger  

Natztech
Shopify Partner
2238 565 1373

hello @Andrewpry 

please Go to Online Store->Theme->Edit code then go to assets/index.css ->paste below code at the bottom of the file.

@media only screen and (min-width: 750px) {
#shopify-section-16344336697d2b265d .content-overlay .content-overlay__heading {
font-size: 40px;
}
#shopify-section-16344336697d2b265d .content-overlay .content-overlay__subheading {
    font-size: 20px;
}
}

 

diego_ezfy
Shopify Partner
2313 415 544

This is an accepted solution.

@Andrewpry, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > index.css theme.css and paste this at the bottom of the file:

@media (min-width: 749px){
    .content-overlay__heading{
    font-size: 40px !important;
}

.content-overlay__subheading{
    font-size: 30px !important;
}
}


you can change the values as per your wish:

40px = title
30px = subtitle

Kind regards,
Diego

◦ Slideshow images cutting off or looking bad? Try the Slideshow (PRO) section. No apps required.
◦ Replace apps with copy/paste code snippets & save money. Examples here.

View solution in original post