IE font-size fixing
This commit is contained in:
parent
9acce25176
commit
dd856d6755
12 changed files with 1088 additions and 1534 deletions
|
@ -1,6 +1,6 @@
|
|||
@import "00-config";
|
||||
/*!
|
||||
* www.KNACSS.com V3.0.2 (2014-05-07) @author: Raphael Goetter, Alsacreations
|
||||
* www.KNACSS.com V3.0.3 (2014-05-019) @author: Raphael Goetter, Alsacreations
|
||||
* Licence WTFPL http://www.wtfpl.net/
|
||||
*/
|
||||
|
||||
|
@ -49,19 +49,29 @@ svg:not(:root) {
|
|||
/* == typography */
|
||||
/* ----------------------------- */
|
||||
|
||||
/* base font-size corresponds to "10px" and is adapted to rem unit */
|
||||
|
||||
html {
|
||||
|
||||
/* set base font-size to equiv "10px", which is adapted to rem unit */
|
||||
font-size: 62.5%;
|
||||
|
||||
/* IE9-IE11 math fixing. See http://bit.ly/1g4X0bX */
|
||||
/* thanks to @guardian, @victorbritopro and @eQRoeil */
|
||||
font-size: calc(1em * 0.625);
|
||||
|
||||
/* disallow text zooming on orientation change (non standard property) */
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
|
||||
/* set body font-size in em (1.4em equiv "14px") */
|
||||
font-size: unit((@base-font-size / 10), em);
|
||||
|
||||
background-color: @base-background;
|
||||
color: @base-color;
|
||||
font-family: @font-stack-common;
|
||||
font-size: unit((@base-font-size / 10), em);
|
||||
font-family: @font-stack-common;
|
||||
line-height: @line-height;
|
||||
}
|
||||
|
||||
|
@ -140,7 +150,8 @@ code,
|
|||
pre,
|
||||
samp,
|
||||
kbd {
|
||||
white-space: pre-line; /* IE fix */
|
||||
/* IE fix */
|
||||
white-space: pre-line;
|
||||
white-space: pre-wrap;
|
||||
font-family: @font-stack-monospace;
|
||||
line-height: normal;
|
||||
|
|
|
@ -13,32 +13,33 @@
|
|||
}
|
||||
|
||||
/* global styles for direct child ex. .grid3 */
|
||||
/* 1- gutter value */
|
||||
.grid > * {
|
||||
display: block;
|
||||
padding: 0;
|
||||
margin-left: -@gutter; /* 1 */
|
||||
/* gutter value */
|
||||
margin-left: -@gutter;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* global styles for each "cell" */
|
||||
/* 1- gutter value */
|
||||
.grid > * > * {
|
||||
display: inline-block;
|
||||
padding-left: @gutter; /* 1 */
|
||||
/* gutter value */
|
||||
padding-left: @gutter;
|
||||
margin-left: 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* whitespace fixing for modern browsers including IE9+ */
|
||||
/* 1- fallback for IE9+ */
|
||||
/* 2- fallback for Opera Mini */
|
||||
:root .grid {
|
||||
font-size: 0;
|
||||
text-justify: distribute-all-lines; /* 1 */
|
||||
/* fallback for IE9+ */
|
||||
text-justify: distribute-all-lines;
|
||||
}
|
||||
|
||||
:root .grid > * > * {
|
||||
font-size: @base-font-size; /* 2 */
|
||||
/* fallback for Opera Mini */
|
||||
font-size: @base-font-size;
|
||||
font-size: unit((@base-font-size / 10), rem);
|
||||
}
|
||||
|
||||
|
@ -153,15 +154,15 @@
|
|||
}
|
||||
|
||||
/* whitespace fixing for modern browsers including IE9+ */
|
||||
/* 1- fallback for IE9+ */
|
||||
/* 2- fallback for Opera Mini */
|
||||
:root [class*="autogrid"] {
|
||||
font-size: 0;
|
||||
text-justify: distribute-all-lines; /* 1 */
|
||||
/* fallback for IE9+ */
|
||||
text-justify: distribute-all-lines;
|
||||
}
|
||||
|
||||
:root [class*="autogrid"] > * {
|
||||
font-size: @base-font-size; /* 2 */
|
||||
/* fallback for Opera Mini */
|
||||
font-size: @base-font-size;
|
||||
font-size: unit((@base-font-size / 10), rem);
|
||||
}
|
||||
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
/* ----------------------------- */
|
||||
|
||||
/* thanks to HTML5boilerplate,
|
||||
* github.com/nathansmith/formalize
|
||||
* and www.sitepen.com
|
||||
* github.com/nathansmith/formalize and www.sitepen.com
|
||||
*/
|
||||
|
||||
/* buttons */
|
||||
|
|
|
@ -4,11 +4,11 @@
|
|||
/* ----------------------------- */
|
||||
|
||||
@media (min-width: @small-screen) {
|
||||
/* here go rules for big resources and big screens like: background-images, font-faces, etc. */
|
||||
/* rules for big resources and big screens like: background-images, font-faces, etc. */
|
||||
}
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
|
||||
/* Style adjustments for retina devices */
|
||||
/* style adjustments for high density devices */
|
||||
}
|
||||
|
||||
/* ---------------------------------- */
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue