How do I change the font size in Page of Colorbook?

Store Design
1

Hello there, it’s me again.

How do I change the font size of the heading “Shipping” together with all other pages like “About” and “Contact” to the font size of the title in Product? I tried adding the code

.header__menu-item {
    font-size: 5rem;
}

to base.css but it seems to fix the size when viewed in mobile as well so it becomes so much bigger than the title in Product when using mobile version.

Is there a way I can set to a specific defined size so that it automatically switch to the font size of Product regardless of using web version or mobile version? Any help would be much appreciated. Thanks a lot guys.

https://summerizeint.myshopify.com/pages/shipping

password: skaung

2

@Newbie_shpfy ,

h1.main-page-title.page-title.h0 {
    font-size: 3rem;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid

1 Like
3

Thanks for your reply bro. But I am afraid that you are not solving my problems. First, the size in your code is not the size I want because it is much smaller on the title of this page. Second, even if the size is correct in the desktop version, it still doesn’t solve the problem of viewing in mobile version. Are there possible codes to solve these 2 problems?

4

Hii,

Desktop code

h1.main-page-title.page-title.h0 {
  font-size: 5rem;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid
its desktop view

oscprofessional_0-1655963544052.png
oscprofessional_0-1655963544052.png1335×533 38.5 KB

Mobile view code

@media only screen and (max-width: 480px){
h1.main-page-title.page-title.h0 {
font-size: 4rem;
}}

Add this css at the “@media only screen and (max-width: 480px)” of Online Store->Theme->Edit code->Assets->base.scss.liquid

Mobile view

oscprofessional_2-1655963756866.png
oscprofessional_2-1655963756866.png411×578 28.7 KB

1 Like
5

Thanks for the help bro. It worked!