I want to set a minimum font size to every element in my HTML page.
For example if there are elements with font-size less then 12px, then they will change to 12px.
But if there are elements with font-size grater then 12px, they will not change.
Is there any way to do it with CSS?
small (13px) medium (16px) large (18px) x-large (24px)
To change the size of your text with inline CSS, you have to do it with the style attribute. You type in the font-size property, and then assign it a value.
While there is no official minimum font size for the web, it is generally agreed upon that 16px for body text is a good starting point. Of course, some text will be smaller and headings will often times be larger. But, the main body text (like what you're reading right now) should usually be 16px or larger.
In CSS3 there is a simple but brilliant hack for that:
font-size:calc(12px + 1.5vw);
This is because the static part of calc() defines the minimum. Even though the dynamic part might shrink to something near 0.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With