• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 10. Text Properties > min-font-size and max-font-size Properties

10.12. min-font-size and max-font-size Properties

You might think that the new CSS3 properties called min-font-size and max-font-size would be used for setting the minimum and maximum font size that could be used globally on a page — perhaps in cases where you have a dynamic value assigned to stretching or squeezing font sizes. Instead, min-font-size and max-font-size are designed to be used in a very specific case; they are only for use in conjunction with the text-align-last property when it is set to size.

text-align-last: size tells the browser to stretch or squeeze the content on the final line of text in a paragraph (or some other block element) so that it fits across the line. This includes changing the font size of the text in order to make that content fit. So min-font-size and max-font-size are used to set the upper and lower constraints. Both min-font-size and max-font-size can take one of four values: a specific numeric font-size value, auto (the default), initial and inherit. initial and inherit are values common to all CSS3 text properties — initial is used to explicitly set a property to its normal default value, and inherit takes on whatever parent value may already been set for the property. The auto value means there is no default limit to the minimum or maximum size for the font. You can expect to use the numeric font size value the most with these properties, as they give you direct control over how much a font in the final line of text in a block element can be re-sized. The following code snippet provides an idea as to how you can expect to use these properties:


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint