Regarding elements that don’t have the option to change font size, what is the proper way to adjust their size/appearance so it responds appropriately with different screen sizes?
For instance, I want to change the size of the text on a full-width button. Is this the proper CSS to ensure it ‘responds’ to varying screen sizes?
.avia_iconbox_title {
font-size: 1.5em;
font-weight: bold;
}
Furthermore, if I want to change the space between the title and button text (below), I should use the “em” sizing instead of absolute “px”, correct?
.av-button-description-below {
margin-top: 0.2em;
}
Both work and do what I want. I just want to ensure this is the proper way of adjusting text when using your theme.
THANKS!
David
Hi David!
em is relative to the base font size (which is either set manually or by the browser default), what you want is probably something like this:
https://css-tricks.com/viewport-sized-typography/
Cheers!
Josue
That’s interesting. Never knew that property existed. Thanks.
So, in my case, does the “em” seem to work because the “font-size” property set by the theme itself was created with responsiveness in mind? It’s just making whatever responsive value 1.5x bigger?
Hi,
Can you post the link to your website please?
Regards,
Josue