6
Contributors
5
Replies
28
Views
4 Years
Discussion Span
Last Post by GrazerC0de
0

How can I make my fonts responsive???

@pardeepkhatri

You mean changing font-size by using percentage base on the media-queries?

Something like this:

@media screen and (max-width: 480px) {

font-size: 50%;

}

Edited by LastMitch

0

I have make my responsive font for my website , you can try this.
body {font-size:100%}

h1 { font-size:6.2em;font-weight:500; }
HTML

1 <div class="row">
2 <div class="twelve columns text-center">
3 <h1> LARGE HEADER TAGLINE </h1>
 4 </div><!-- End Tagline -->
5nn</div><!-- End Row -->
0

If you really want a good responsive font sizes, I would recommend using em instead of px. There's actually a simple formula for this.

target(initial px size) / content(usually 16) = result

So let's say your font size you want to achieve in pixels is 14. With most browser windows, the base font size is 16. In order to achieve this just simply use your formula.

target (14px) / content (16px) = result (0.875em)

So instead of setting your font-size to 14px - use 0.875em.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.