carlos-sanchez
12/15/2016 - 4:27 PM

Responsive display text https://24ways.org/2016/responsive-display-text/ https://madebymike.com.au/writing/fluid-type-calc-examples/ http://

Responsive display text https://24ways.org/2016/responsive-display-text/ https://madebymike.com.au/writing/fluid-type-calc-examples/ http://codepen.io/MadeByMike/pen/RWJyML

responsive-text.css
content_copyfile_download
h2 {
    font-size: calc(0.5rem + 2.5vmin);
}
alternativa3
content_copyfile_download
https://eduardoboucas.com/blog/2015/06/18/viewport-sized-typography-with-minimum-and-maximum-sizes.html
advanced-responsive-text.less
content_copyfile_download
.fluid-type(@property, @min-vw, @max-vw, @min-size, @max-size) {

	@{property}: @min-size;
	
	@media screen and (min-width: @min-vw) {
		@{property}: calc( @min-size ~" + " unit(@max-size - @min-size) ~" * ((100vw - " @min-vw ~") /" unit(@max-vw - @min-vw) ~")" );
	}

	@media screen and (min-width: @max-vw) {
		@{property}: @max-size;
	}

}

body {
	.fluid-type(font-size, 600px, 900px, 12px, 28px);
}