Skip to content

Instantly share code, notes, and snippets.

@alecperkins
Created October 15, 2011 22:49
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save alecperkins/1290264 to your computer and use it in GitHub Desktop.
Save alecperkins/1290264 to your computer and use it in GitHub Desktop.
Sass version of normalize.css
// generated using `sass-convert normalize.css`
/*! normalize.css 2011-08-12T17:28 UTC · http://github.com/necolas/normalize.css
/* =============================================================================
* HTML5 display definitions
* ==========================================================================
/*
* Corrects block display not defined in IE6/7/8/9 & FF3
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section
display: block
/*
* Corrects inline-block display not defined in IE6/7/8/9 & FF3
audio, canvas, video
display: inline-block
*display: inline
*zoom: 1
/*
* Prevents modern browsers from displaying 'audio' without controls
audio:not([controls]), [hidden]
display: none
/*
* Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4
* Known issue: no IE6 support
/* =============================================================================
* Base
* ==========================================================================
/*
* 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
* http://clagnut.com/blog/348/#c790
* 2. Keeps page centred in all browsers regardless of content height
* 3. Prevents iOS text size adjust after orientation change, without disabling user zoom
* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
html
font-size: 100%
/* 1
overflow-y: scroll
/* 2
-webkit-text-size-adjust: 100%
/* 3
-ms-text-size-adjust: 100%
/* 3
/*
* Addresses margins handled incorrectly in IE6/7
body
margin: 0
font-family: sans-serif
/*
* Addresses font-family inconsistency between 'textarea' and other form elements.
button, input, select, textarea
font-family: sans-serif
/* =============================================================================
* Links
* ==========================================================================
a
color: #00e
&:visited
color: #551a8b
&:focus
outline: thin dotted
&:hover, &:active
outline: 0
/*
* Addresses outline displayed oddly in Chrome
/*
* Improves readability when focused and also mouse hovered in all browsers
* people.opera.com/patrickl/experiments/keyboard/test
/* =============================================================================
* Typography
* ==========================================================================
/*
* Addresses styling not present in IE7/8/9, S5, Chrome
abbr[title]
border-bottom: 1px dotted
/*
* Addresses style set to 'bolder' in FF3/4, S4/5, Chrome
b, strong
font-weight: bold
blockquote
margin: 1em 40px
/*
* Addresses styling not present in S5, Chrome
dfn
font-style: italic
/*
* Addresses styling not present in IE6/7/8/9
mark
background: #ff0
color: #000
/*
* Corrects font family set oddly in IE6, S4/5, Chrome
* en.wikipedia.org/wiki/User:Davidgothberg/Test59
pre, code, kbd, samp
font-family: monospace, serif
_font-family: 'courier new', monospace
font-size: 1em
/*
* Improves readability of pre-formatted text in all browsers
pre
white-space: pre
white-space: pre-wrap
word-wrap: break-word
/*
* 1. Addresses CSS quotes not supported in IE6/7
* 2. Addresses quote property not supported in S4
/* 1
q
quotes: none
&:before, &:after
content: ''
content: none
/* 2
small
font-size: 75%
/*
* Prevents sub and sup affecting line-height in all browsers
* gist.github.com/413930
sub
font-size: 75%
line-height: 0
position: relative
vertical-align: baseline
sup
font-size: 75%
line-height: 0
position: relative
vertical-align: baseline
top: -0.5em
sub
bottom: -0.25em
/* =============================================================================
* Lists
* ==========================================================================
ul, ol
margin: 1em 0
padding: 0 0 0 40px
dd
margin: 0 0 0 40px
nav
ul, ol
list-style: none
list-style-image: none
/* =============================================================================
* Embedded content
* ==========================================================================
/*
* 1. Removes border when inside 'a' element in IE6/7/8/9
* 2. Improves image quality when scaled in IE7
* code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
img
border: 0
/* 1
-ms-interpolation-mode: bicubic
/* 2
/*
* Corrects overflow displayed oddly in IE9
svg:not(:root)
overflow: hidden
/* =============================================================================
* Figures
* ==========================================================================
/*
* Addresses margin not present in IE6/7/8/9, S5, O11
figure, form
margin: 0
/* =============================================================================
* Forms
* ==========================================================================
/*
* Corrects margin displayed oddly in IE6/7
/*
* Define consistent margin and padding
fieldset
margin: 0 2px
padding: 0.35em 0.625em 0.75em
/*
* 1. Corrects color not being inherited in IE6/7/8/9
* 2. Corrects alignment displayed oddly in IE6/7
legend
border: 0
/* 1
*margin-left: -7px
/* 2
/*
* 1. Corrects font size not being inherited in all browsers
* 2. Addresses margins set differently in IE6/7, F3/4, S5, Chrome
* 3. Improves appearance and consistency in all browsers
button, input, select, textarea
font-size: 100%
/* 1
margin: 0
/* 2
vertical-align: baseline
/* 3
*vertical-align: middle
/* 3
/*
* 1. Addresses FF3/4 setting line-height using !important in the UA stylesheet
* 2. Corrects inner spacing displayed oddly in IE6/7
button, input
line-height: normal
/* 1
*overflow: visible
/* 2
/*
* Corrects overlap and whitespace issue for buttons and inputs in IE6/7
* Known issue: reintroduces inner spacing
table
button, input
*overflow: auto
/*
* 1. Improves usability and consistency of cursor style between image-type 'input' and others
* 2. Corrects inability to style clickable 'input' types in iOS
button, html input[type="button"]
cursor: pointer
/* 1
-webkit-appearance: button
/* 2
input
&[type="reset"], &[type="submit"]
cursor: pointer
/* 1
-webkit-appearance: button
/* 2
&[type="checkbox"], &[type="radio"]
box-sizing: border-box
/* 1
padding: 0
/* 2
&[type="search"]
-webkit-appearance: textfield
/* 1
-moz-box-sizing: content-box
-webkit-box-sizing: content-box
/* 2
box-sizing: content-box
&::-webkit-search-decoration
-webkit-appearance: none
/*
* 1. Addresses box sizing set to content-box in IE8/9
* 2. Addresses excess padding in IE8/9
/*
* 1. Addresses appearance set to searchfield in S5, Chrome
* 2. Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof)
/*
* Corrects inner padding displayed oddly in S5, Chrome on OSX
/*
* Corrects inner padding and border displayed oddly in FF3/4
* www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
button::-moz-focus-inner, input::-moz-focus-inner
border: 0
padding: 0
/*
* 1. Removes default vertical scrollbar in IE6/7/8/9
* 2. Improves readability and alignment in all browsers
textarea
overflow: auto
/* 1
vertical-align: top
/* 2
/* =============================================================================
* Tables
* ==========================================================================
/*
* Remove most spacing between table cells
table
border-collapse: collapse
border-spacing: 0
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment