Responsive font sizes : RFS

As >4.3 Bootstrap supports responsive font sizes, could there be an option to enable that for automatic scaling of typography?

2 Likes

@Shrike, I’ll be following this as it would be a great help when optimizing for mobile!

1 Like

Wasn’t there a custom bric that did something similar?

There is TextBloc | Blocs Store

and Fit Text | Blocs Store

What is the difference between them?
Pros / Cons

I don’t know enough about either bric to tell you the real differences.

Resizing fonts automatically can create issues. If you use, for example, a 12pt type size in a desktop version, it may resize to about 5pt on a mobile variant of the site if resizing was automatic. This is one of the problems that niggled me in Sparkle. The whole page, including its fonts, would scale down at smaller screen sizes which meant having to go into each device variant and adjust everything manually. I feel it’s much better to simply have the fonts remain the same size and just have your text wrap on smaller devices. In some instances, it may be desirable to reduce fonts for headings etc. for different devices but, this can be done fairly easily using custom classes to adjust font size for different devices. Body text, however, should remain much the same size regardless of the device.

1 Like

What I have tested with Bootstrap >4.3, it scales only headings with big font-sizes and do not scale anything too small, like body/p.

Almost in all cases, the bigger sizes on headings and alike are the problem.