Streaming live at 10am (PST)

Screen and Element Size

When I change the size on a small screen, it also changes on a larger screen.
For example, 72pt font on small screen / 72pt font on larger screen,
but I want to make it 72pt for small and 100pt for larger.

There’s a Brake Point.

Do I have to change the div name? I used to have the same div name when I was coding… Just different brake point.


whatever changes to classes you make on smaller breakpoints affect the bigger breakpoints, but not the other way around. You should first set the font size to 100 on a larger breakpoint, and after that 72 on a smaller breakpoint.

Thank you for reply.

Actually, I did that way and it changed.
For example, I did 1920 screen size for 100 size font and then go to the 922 screen size for 72.
But, 1920 and 922 screen fonts size are 72, somehow…

Below this is the visual drawing that I made, and I think it is much easier to understand then writing.

Additional Info

I tired to make the Div Class name, differently for both screen sizes.
However, both screens automatically changed the Div name to the same one.

How can I make different Div Class name for both screen sizes?

Below this is the photos that show both screens have same Div name.
1 2


you can’t change class names on breakpoints. The only solution to using different classes on different breakpoints is to set two separate classes and setting the first class to “display: none” and the second one to “display: block” on the different breakpoints.

But your font size problem sounds odd, and shouldn’t happen. Could you link the read-only version of your site?

Sure! This is the read-only version link.

Click to see

Also, Thank you for giving useful information!