From a36cead4ca091b2eec9de90f5596ecff6cbddd9e Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Thu, 26 May 2011 10:17:58 -0700 Subject: [PATCH 001/112] github generated gh-pages branch --- index.html | 85 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 85 insertions(+) create mode 100644 index.html diff --git a/index.html b/index.html new file mode 100644 index 000000000..335d033b1 --- /dev/null +++ b/index.html @@ -0,0 +1,85 @@ + + + + + + necolas/normalize.css @ GitHub + + + + + + Fork me on GitHub + +
+ +
+ + + + +
+ +

normalize.css + by necolas

+ +
+ normalize.css makes browsers render all elements consistently and in line with modern standards. +
+ +

Authors

+

necolas (nicolasgallagher@gmail.com)
Jonathan (jonathantneal@hotmail.com)

+

Contact

+

Nicolas Gallagher (nicolas@nicolasgallagher.com)

+ + +

Download

+

+ You can download this project in either + zip or + tar formats. +

+

You can also clone the project with Git + by running: + 

$ git clone git://github.com/necolas/normalize.css
+

+ +
+ get the source code on GitHub : necolas/normalize.css +
+ +
+ + + + + From 6716c48dfae0f2459c4d48423695125774ad5b80 Mon Sep 17 00:00:00 2001 From: necolas Date: Fri, 27 May 2011 01:44:14 +0100 Subject: [PATCH 002/112] Add project page, description, links to source, and acknowledgements. Add demo page --- demo.html | 297 +++++++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 291 ++++++++++++++++++++++++++++++++++++--------------- 2 files changed, 506 insertions(+), 82 deletions(-) create mode 100644 demo.html diff --git a/demo.html b/demo.html new file mode 100644 index 000000000..142a04c0e --- /dev/null +++ b/demo.html @@ -0,0 +1,297 @@ + + + + + + Normalize CSS + + + + + +
+
+

Grouped Heading 1

+

Grouped Heading 2

+
+ +
+ +

Heading 1

+

Heading 2

+

Heading 3

+

Heading 4

+
Heading 5
+
Heading 6
+ +
+

Section Heading 1

+
+

Article Heading 2

+
Address: somewhere, world
+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

+
+
+ +

Text-level semantics

+ +

+ The a element example
+ The abbr element example
+ The b element example
+ The cite element example
+ The code element example
+ The del element example
+ The dfn element example
+ The em element example
+ The i element example
+ The img element example
+ The ins element example
+ The kbd element example
+ The mark element example
+ The q element inside a q element example
+ The s element example
+ The samp element example
+ The small element example
+ The span element example
+ The strike element example
+ The strong element example
+ The sub element example
+ The sup element example
+ The var element example
+ The u element example +

+ +

Grouping content

+ +

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

+ +

pre

+ + 
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.
+ 
<html>
+    <head>
+    </head>
+    <body>
+        <div class="main"> <div>
+    </body>
+</html>
+ +

blockquote

+ +
+

Some sort of famous witty quote marked up with a <blockquote> and a child <p> element.

+
+ +
Even better philosophical quote marked up with just a <blockquote> element.
+ +

ordered list

+ +
    +
  1. list item 1
    2. +
  2. list item 1 +
      +
    1. list item 2
      2. +
    2. list item 2 +
        +
      1. list item 3
        2. +
      2. list item 3
        3. +
      +
      3. +
    3. list item 2
      4. +
    4. list item 2
      5. +
    +
    3. +
  3. list item 1
    4. +
  4. list item 1
    5. +
+ +

unordered list

+ + + +

description list

+ +
+
Description name
+
Description value
+
Description name
+
Description value
+
Description value
+
Description name
+
Description name
+
Description value
+
+ +

figure

+ +
+ +
Figcaption content
+
+ +

Tabular data

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Jimi Hendrix - albums
AlbumYearPrice
AlbumYearPrice
Are You Experienced1967$10.00
Axis: Bold as Love1967$12.00
Electric Ladyland1968$10.00
Band of Gypsys1970$12.00
+ +

Forms

+ +
+
+ Inputs as descendents of labels (form legend) +

+

+

+

+

+

+

+ +

+

+

+

+ +

+

+
+ +
+ Inputs as siblings of labels +

+

+

+

+

+

+

+

+ +

+

+

+

+ +

+

+
+ +
+ Clickable inputs and buttons +

+

+

+

+ +

+

+

+
+ +
+ box-sizing tests +
+
+
+
+
+ +
+
+
+
+
+
+
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+
+
+
+ + + \ No newline at end of file diff --git a/index.html b/index.html index 335d033b1..03c29ada7 100644 --- a/index.html +++ b/index.html @@ -1,85 +1,212 @@ - - - - necolas/normalize.css @ GitHub - - - - - - Fork me on GitHub - -
- -
- - - - -
- -

normalize.css - by necolas

- -
- normalize.css makes browsers render all elements consistently and in line with modern standards. -
- -

Authors

-

necolas (nicolasgallagher@gmail.com)
Jonathan (jonathantneal@hotmail.com)

-

Contact

-

Nicolas Gallagher (nicolas@nicolasgallagher.com)

- - -

Download

-

- You can download this project in either - zip or - tar formats. -

-

You can also clone the project with Git - by running: - 

$ git clone git://github.com/necolas/normalize.css
-

- -
- get the source code on GitHub : necolas/normalize.css -
- -
- - - - + + + + + Normalize CSS : necolas/normalize.css @ GitHub + + + + + + + Fork me on GitHub + + +
+ +

normalize.css

+ +

Normalize.css is a customisable CSS file that makes browsers render all elements more consistently and in line with modern standards.

+ +

What does it do?

+
    +
  • Preserves useful defaults, unlike many CSS resets.
    • +
  • Normalizes styles for a wide range of elements.
    • +
  • Corrects bugs and common browser inconsistencies.
    • +
  • Improves usability with subtle improvements.
    • +
  • Explains what code does using detailed comments.
    • +
+ +
+ Check out the demo +

Get the normalize.css file

+
+ +

How to use it

+

You are encouraged to read, edit, customise, add, and trim rulesets or styles from normalize.css on a per project basis.

+

The normalize.css file is not intended to be a mysterious "black box" that is included in a project and then ignored. It should be used as a customisable starting point on any project.

+ +

Browser support

+

Chrome, Firefox 3+, Safari 4+, Opera 10+, Internet Explorer 6+

+ +

Source code

+

Get the source code on GitHub: necolas/normalize.css, or download it in either zip or tar formats.

+

You can also clone the project with Git by running: 

$ git clone git://github.com/necolas/normalize.css

+ +

Acknowledgements

+

Normalize.css is a project by Jonathan Neal and Nicolas Gallagher. Our branches have diverged somewhat and I recommend that you also have a look at Jonathan's normalize.css branch.

+ +
+

Made by Nicolas Gallagher and Jonathan Neal.

+
+ +
+ + + From 95b4971ffcfe33ff42e2d23c5bb69d5eed6ee6e0 Mon Sep 17 00:00:00 2001 From: necolas Date: Fri, 27 May 2011 01:50:38 +0100 Subject: [PATCH 003/112] Add normalize.css --- normalize.css | 405 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 405 insertions(+) create mode 100644 normalize.css diff --git a/normalize.css b/normalize.css new file mode 100644 index 000000000..38e27f109 --- /dev/null +++ b/normalize.css @@ -0,0 +1,405 @@ +/* ============================================================================================================= HTML5 ELEMENT DISPLAY */ + +/* + * Add display for block-level HTML5 elements + * Display not defined in IE6/7/8/9 & FF3 + */ + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +nav, +section { + display: block; +} + +/* + * Add display for embedded HTML5 elements + * Display not defined in IE6/7/8/9 & FF3 + */ + +audio, +canvas, +video { + display: inline-block; + *display: inline; + *zoom: 1; +} + + +/* ============================================================================================================= BASE STYLES & FIXES */ + +/* + * 1. Add vertical scrollbar to element + * Keeps page centred in all browsers regardless of content height + * 2. Remove iOS tap highlight color to prevent entire container's being highlighted + * www.yuiblog.com/blog/2010/10/01/quick-tip-customizing-the-mobile-safari-tap-highlight-color/ + * 3. Remove iOS text size adjust without disabling user zoom + * www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ + */ + +html { + overflow-y: scroll; /* 1 */ + -webkit-tap-highlight-color: transparent; /* 2 */ + -webkit-text-size-adjust: 100%; /* 3 */ + -ms-text-size-adjust: 100%; +} + +/* + * 1. Define the base font-size of choice; set in % or em to retain text resizing in IE6/7 + * 2. Define the base line-height of choice. + * 3. Remove margin from element + */ + +body { + font-size: 100%; /* 1 */ + line-height: normal; /* 2 */ + margin: 0; /* 3 */ +} + +/* + * Define the base font-family and text color for and form elements + * Fixes font-family inconsistency between -
+
diff --git a/normalize.css b/normalize.css index f3b94b2c7..57b2b3770 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-06-21T02:22 http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-06-21T18:23 UTC · http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 element display @@ -77,17 +77,6 @@ textarea { font-family: sans-serif; } -/* - * 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 */ -} - /* ============================================================================= Links @@ -251,6 +240,30 @@ nav ol { } +/* ============================================================================= + 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 ========================================================================== */ From 599e5c698541262331b29cfcf7563dc8d7d4dc48 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 12 Jul 2011 13:06:20 +0200 Subject: [PATCH 020/112] Update demo.html and normalize.css from master branch --- demo.html | 10 ++++++++++ normalize.css | 18 ++++++++++++++---- 2 files changed, 24 insertions(+), 4 deletions(-) diff --git a/demo.html b/demo.html index 43caeb0f4..757855a12 100644 --- a/demo.html +++ b/demo.html @@ -80,6 +80,11 @@

Text-level semantics

Embedded content

+

audio

+ + + +

img

@@ -89,6 +94,11 @@

svg

+

video

+ + + +

Grouping content

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

diff --git a/normalize.css b/normalize.css index 57b2b3770..5664951b8 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-06-21T18:23 UTC · http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-07-12T10:51 UTC · http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 element display @@ -31,7 +31,7 @@ canvas, video { display: inline-block; *display: inline; - zoom: 1; + *zoom: 1; } @@ -335,13 +335,23 @@ input { *overflow: visible; /* 2 */ } +/* + * Corrects overlap and whitespace issue for buttons and inputs in IE6/7 + * Known issue: reintroduces inner spacing + */ + +table button, +table 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, -input[type="button"], +html input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; /* 1 */ @@ -390,7 +400,7 @@ input::-moz-focus-inner { /* * 1. Removes default vertical scrollbar in IE6/7/8/9 - * 2. Improves readability and aligment in all browsers + * 2. Improves readability and alignment in all browsers */ textarea { From 3c1bb7310fd23ef636670d2e1359082361bc9e0b Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Wed, 20 Jul 2011 20:54:45 +0100 Subject: [PATCH 021/112] Update demo.html and normalize.css from 'master' branch --- demo.html | 2 ++ normalize.css | 25 +++++++++++++++++++++---- 2 files changed, 23 insertions(+), 4 deletions(-) diff --git a/demo.html b/demo.html index 757855a12..fe998d9d7 100644 --- a/demo.html +++ b/demo.html @@ -38,6 +38,8 @@

Heading 3

Heading 4

Heading 5
Heading 6
+ +

Section Heading 1

diff --git a/normalize.css b/normalize.css index 5664951b8..a6b48b318 100644 --- a/normalize.css +++ b/normalize.css @@ -1,7 +1,7 @@ -/*! normalize.css 2011-07-12T10:51 UTC · http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-07-20T19:34 UTC · http://github.com/necolas/normalize.css */ /* ============================================================================= - HTML5 element display + HTML5 display definitions ========================================================================== */ /* @@ -23,10 +23,9 @@ section { /* * Corrects inline-block display not defined in IE6/7/8/9 & FF3 - * Known limitation: IE6 will not apply style for 'audio[controls]' */ -audio[controls], +audio, canvas, video { display: inline-block; @@ -34,6 +33,24 @@ video { *zoom: 1; } +/* + * Prevents modern browsers from displaying 'audio' without controls + */ + +audio:not([controls]) { + display: none; +} + +/* + * Addresses styling not present IE6/7/8/9, FF3, S4 + * Ensures content is hidden from all presentations, including screenreaders + */ + +[hidden] { + display: none; + visibility: hidden; +} + /* ============================================================================= Base From a8f83a89926c66db17b4859337e57e508e76b415 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Sun, 24 Jul 2011 18:08:09 +0100 Subject: [PATCH 022/112] Add Google +1 and Facebook Like buttons --- index.html | 42 +++++++++++++++++++++++++++++------------- style.css | 12 ++++++++++-- 2 files changed, 39 insertions(+), 15 deletions(-) diff --git a/index.html b/index.html index f26ebcd44..b8ed02c30 100644 --- a/index.html +++ b/index.html @@ -49,13 +49,24 @@

Acknowledgements

Normalize.css is a project by Nicolas Gallagher and Jonathan Neal.

Detailed information on default UA styles: Internet Explorer User Agent Style Sheets and CSS2.1 User Agent Style Sheet Defaults

- - +

A project by Nicolas Gallagher and Jonathan Neal.

@@ -63,13 +74,18 @@

Acknowledgements

+
+ diff --git a/style.css b/style.css index d8eb42b91..e4066c5bf 100644 --- a/style.css +++ b/style.css @@ -141,8 +141,16 @@ p { background: #569107; } -.twitter-share-button { - margin: 20px 0 0; +.share-bar { + overflow: hidden; + margin: 40px 0 0; + *zoom: 1; +} + +.share-opt { + float: left; + margin: 0 15px 0 0; + vertical-align: bottom; } .footer { From a85afa128f12c87859ceec28eecc523116659342 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Wed, 3 Aug 2011 10:51:57 +0100 Subject: [PATCH 023/112] Update normalize.css from master branch --- normalize.css | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) diff --git a/normalize.css b/normalize.css index a6b48b318..65f18898d 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-07-20T19:34 UTC · http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-08-03T09:41 UTC · http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -42,13 +42,11 @@ audio:not([controls]) { } /* - * Addresses styling not present IE6/7/8/9, FF3, S4 - * Ensures content is hidden from all presentations, including screenreaders + * Addresses styling for 'hidden' attribute not present in IE6/7/8/9, FF3, S4 */ [hidden] { display: none; - visibility: hidden; } @@ -60,18 +58,15 @@ audio:not([controls]) { * 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. Removes Android and iOS tap highlight color to prevent entire container being highlighted - * www.yuiblog.com/blog/2010/10/01/quick-tip-customizing-the-mobile-safari-tap-highlight-color/ - * 4. Prevents iOS text size adjust after orientation change, without disabling user zoom + * 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-tap-highlight-color: rgba(0,0,0,0); /* 3 */ - -webkit-text-size-adjust: 100%; /* 4 */ - -ms-text-size-adjust: 100%; /* 4 */ + -webkit-text-size-adjust: 100%; /* 3 */ + -ms-text-size-adjust: 100%; /* 3 */ } /* @@ -254,6 +249,7 @@ dd { nav ul, nav ol { list-style: none; + list-style-image: none; } From 250222ea1c7c2ac9d5923ea1f144bd9b69da316c Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Thu, 11 Aug 2011 10:28:46 +0100 Subject: [PATCH 024/112] Update normalize.css from github/master --- normalize.css | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/normalize.css b/normalize.css index 65f18898d..641b1ff9a 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-08-03T09:41 UTC · http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-08-11T09:26 UTC · http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -42,7 +42,8 @@ audio:not([controls]) { } /* - * Addresses styling for 'hidden' attribute not present in IE6/7/8/9, FF3, S4 + * Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4 + * Known issue: no IE6 support */ [hidden] { @@ -164,7 +165,7 @@ mark { } /* - * Corrects font family set oddly in IE6, S5, Chrome + * Corrects font family set oddly in IE6, S4/5, Chrome * en.wikipedia.org/wiki/User:Davidgothberg/Test59 */ @@ -172,7 +173,7 @@ pre, code, kbd, samp { - font-family: monospace, monospace; + font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; } From 03c8acf2235da7c9bf61c5ce0ea7645fe60d8260 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Fri, 12 Aug 2011 18:35:53 +0100 Subject: [PATCH 025/112] Update normalize.css and demo.html from github/master --- demo.html | 4 ++-- normalize.css | 8 +++++--- 2 files changed, 7 insertions(+), 5 deletions(-) diff --git a/demo.html b/demo.html index fe998d9d7..e9080438f 100644 --- a/demo.html +++ b/demo.html @@ -55,12 +55,12 @@

Text-level semantics

The a element example
- The abbr element example
+ The abbr element and abbr element with title examples
The b element example
The cite element example
The code element example
The del element example
- The dfn element example
+ The dfn element and dfn element with title examples
The em element example
The i element example
The img element example
diff --git a/normalize.css b/normalize.css index 641b1ff9a..9fc7ae4df 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-08-11T09:26 UTC · http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-08-12T17:28 UTC · http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -373,12 +373,14 @@ input[type="submit"] { } /* - * Addresses box sizing set to content-box in IE8/9 + * 1. Addresses box sizing set to content-box in IE8/9 + * 2. Addresses excess padding in IE8/9 */ input[type="checkbox"], input[type="radio"] { - box-sizing: border-box; + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ } /* From 3f6ccbaf0c501ba5e72e6c5b186d035235ef079d Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 30 Aug 2011 17:08:37 +0100 Subject: [PATCH 026/112] Update demo.html from master branch --- demo.html | 109 +++++++++++++++++++++++++++--------------------------- 1 file changed, 55 insertions(+), 54 deletions(-) diff --git a/demo.html b/demo.html index e9080438f..55bf28093 100644 --- a/demo.html +++ b/demo.html @@ -11,9 +11,9 @@ #boxsize input, #boxsize select, #boxsize textarea { - width:200px; - padding:5px; - border:1px solid #333; + width: 200px; + padding: 5px; + border: 1px solid #333; } @@ -31,7 +31,7 @@

Grouped Heading 2

- +

Heading 1

Heading 2

Heading 3

@@ -40,9 +40,9 @@
Heading 5
Heading 6
- +
-

Section Heading 1

+

Section Heading 1

Article Heading 2

Address: somewhere, world
@@ -50,7 +50,7 @@

Article Heading 2

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

- +

Text-level semantics

@@ -72,16 +72,15 @@

Text-level semantics

The samp element example
The small element example
The span element example
- The strike element example
The strong element example
The sub element example
The sup element example
The var element example
The u element example

- +

Embedded content

- +

audio

@@ -93,8 +92,10 @@

img

svg

- - + + + +

video

@@ -102,11 +103,11 @@

video

Grouping content

- +

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

- +

pre

- + 
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.
<html>
@@ -116,17 +117,17 @@ 
pre

         <div class="main"> <div>
     </body>
 </html>
- +

blockquote

- +

Some sort of famous witty quote marked up with a <blockquote> and a child <p> element.

- +
Even better philosophical quote marked up with just a <blockquote> element.
- +

ordered list

- +
  1. list item 1
  2. list item 1 @@ -145,9 +146,9 @@

    ordered list

  3. list item 1
  4. list item 1
- +

unordered list

- +
  • list item 1
  • list item 1 @@ -166,9 +167,9 @@

    unordered list

  • list item 1
  • list item 1
- +

description list

- +
Description name
Description value
@@ -179,7 +180,7 @@

description list

Description name
Description value
- +

figure

@@ -188,8 +189,8 @@

figure

Tabular data

- - + +
@@ -228,9 +229,9 @@

Tabular data

Jimi Hendrix - albums
- +

Forms

- +
Inputs as descendents of labels (form legend) @@ -241,36 +242,36 @@

Forms

- +

- +

- +
Inputs as siblings of labels -

+

-

-

-

-

-

-

+

+

+

+

+

+

- +

- +
Clickable inputs and buttons

@@ -282,30 +283,30 @@

Forms

- +
box-sizing tests
-
+
-
-
-
-
-
-
-
-
- +
+
+
+
+
+
+
+
+
- +
- +
From 7e939a1ca7fe6a3a1cdf1898c14fa4c3ae3bc1a3 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 20 Sep 2011 14:37:20 +0100 Subject: [PATCH 027/112] Update normalize.css from master branch --- normalize.css | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/normalize.css b/normalize.css index 9fc7ae4df..487511ece 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-08-12T17:28 UTC · http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-09-14T10:27 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -259,7 +259,7 @@ nav ol { ========================================================================== */ /* - * 1. Removes border when inside 'a' element in IE6/7/8/9 + * 1. Removes border when inside 'a' element in IE6/7/8/9, FF3 * 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/ */ @@ -304,10 +304,11 @@ form { } /* - * Define consistent margin and padding + * Define consistent border, margin, and padding */ fieldset { + border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } @@ -324,7 +325,7 @@ legend { /* * 1. Corrects font size not being inherited in all browsers - * 2. Addresses margins set differently in IE6/7, F3/4, S5, Chrome + * 2. Addresses margins set differently in IE6/7, FF3/4, S5, Chrome * 3. Improves appearance and consistency in all browsers */ @@ -365,7 +366,7 @@ table input { */ button, -html input[type="button"], +input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; /* 1 */ From 34680acb332fb90b1bc28f85dc336eeb7cc2ac32 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Thu, 22 Sep 2011 18:41:34 +0100 Subject: [PATCH 028/112] Update normalize.css and demo.html from master branch --- demo.html | 2 +- normalize.css | 19 +++++-------------- 2 files changed, 6 insertions(+), 15 deletions(-) diff --git a/demo.html b/demo.html index 55bf28093..feb8e788f 100644 --- a/demo.html +++ b/demo.html @@ -235,7 +235,7 @@

Forms

Inputs as descendents of labels (form legend) -

+

diff --git a/normalize.css b/normalize.css index 487511ece..7e7bab9a4 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-09-14T10:27 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-09-22T17:42 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -340,29 +340,19 @@ textarea { } /* - * 1. Addresses FF3/4 setting line-height using !important in the UA stylesheet - * 2. Corrects inner spacing displayed oddly in IE6/7 + * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet */ 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, -table 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 + * 3. Corrects inner spacing displayed oddly in IE7 without effecting normal text inputs + * Known issue: inner spacing remains in IE6 */ button, @@ -371,6 +361,7 @@ input[type="reset"], input[type="submit"] { cursor: pointer; /* 1 */ -webkit-appearance: button; /* 2 */ + *overflow: visible; /* 3 */ } /* From 738abae647bb73314717b19198dff7990469c7cb Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Fri, 4 Nov 2011 15:41:50 +0000 Subject: [PATCH 029/112] Update normalize.css and demo.html from master branch --- demo.html | 49 +++++++++++++++++++++++++++++++------------------ normalize.css | 34 +++++++++++++++++----------------- 2 files changed, 48 insertions(+), 35 deletions(-) diff --git a/demo.html b/demo.html index feb8e788f..6fd5c619e 100644 --- a/demo.html +++ b/demo.html @@ -18,10 +18,35 @@ +

Heading 1

+

Heading 2

+

Heading 3

+

Heading 4

+
Heading 5
+
Heading 6
+ +
+

Heading 1 (in section)

+

Heading 2 (in section)

+

Heading 3 (in section)

+

Heading 4 (in section)

+
Heading 5 (in section)
+
Heading 6 (in section)
+
+ +
+

Heading 1 (in article)

+

Heading 2 (in article)

+

Heading 3 (in article)

+

Heading 4 (in article)

+
Heading 5 (in article)
+
Heading 6 (in article)
+
+
-

Grouped Heading 1

-

Grouped Heading 2

+

Heading 1 (in hgroup)

+

Heading 2 (in hgroup)

-

Heading 1

-

Heading 2

-

Heading 3

-

Heading 4

-
Heading 5
-
Heading 6
+

Text-level semantics

-
-

Section Heading 1

-
-

Article Heading 2

-
Address: somewhere, world
-

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

-

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

-
-
+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

-

Text-level semantics

+
Address: somewhere, world

The a element example
diff --git a/normalize.css b/normalize.css index 7e7bab9a4..977681330 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-09-22T17:42 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2011-11-04T15:38 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -95,14 +95,6 @@ textarea { Links ========================================================================== */ -a { - color: #00e; -} - -a:visited { - color: #551a8b; -} - /* * Addresses outline displayed oddly in Chrome */ @@ -126,6 +118,14 @@ a:active { Typography ========================================================================== */ +/* + * Neutralise smaller font-size in 'section' and 'article' in FF4+, Chrome, S5 + */ + +h1 { + font-size: 2em; +} + /* * Addresses styling not present in IE7/8/9, S5, Chrome */ @@ -135,7 +135,7 @@ abbr[title] { } /* - * Addresses style set to 'bolder' in FF3/4, S4/5, Chrome + * Addresses style set to 'bolder' in FF3+, S4/5, Chrome */ b, @@ -239,7 +239,7 @@ sub { ul, ol { - margin: 1em 0; + margin-left: 0; padding: 0 0 0 40px; } @@ -325,7 +325,7 @@ legend { /* * 1. Corrects font size not being inherited in all browsers - * 2. Addresses margins set differently in IE6/7, FF3/4, S5, Chrome + * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome * 3. Improves appearance and consistency in all browsers */ @@ -351,7 +351,7 @@ input { /* * 1. Improves usability and consistency of cursor style between image-type 'input' and others * 2. Corrects inability to style clickable 'input' types in iOS - * 3. Corrects inner spacing displayed oddly in IE7 without effecting normal text inputs + * 3. Removes inner spacing in IE7 without affecting normal text inputs * Known issue: inner spacing remains in IE6 */ @@ -366,7 +366,7 @@ input[type="submit"] { /* * 1. Addresses box sizing set to content-box in IE8/9 - * 2. Addresses excess padding in IE8/9 + * 2. Removes excess padding in IE8/9 */ input[type="checkbox"], @@ -377,7 +377,7 @@ input[type="radio"] { /* * 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) + * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof) */ input[type="search"] { @@ -388,7 +388,7 @@ input[type="search"] { } /* - * Corrects inner padding displayed oddly in S5, Chrome on OSX + * Removes inner padding that is displayed in S5, Chrome on OS X */ input[type="search"]::-webkit-search-decoration { @@ -396,7 +396,7 @@ input[type="search"]::-webkit-search-decoration { } /* - * Corrects inner padding and border displayed oddly in FF3/4 + * Removes inner padding and border in FF3+ * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */ From e5bd07f71bfd4632e71be9a108a49931eff1a58a Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Sun, 20 Nov 2011 18:21:10 +0000 Subject: [PATCH 030/112] Correct path that is provided in git clone instructions --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index b8ed02c30..f605527c5 100644 --- a/index.html +++ b/index.html @@ -43,7 +43,7 @@

Source code

Available on GitHub: necolas/normalize.css

Download it in either zip or tar formats.

Clone the project with Git by running:

- 
$ git clone git://github.com/necolas/normalize.css
+ 
$ git clone git://github.com/necolas/normalize.css.git

Acknowledgements

Normalize.css is a project by Nicolas Gallagher and Jonathan Neal.

From f501de724ddc22bf57f92d99d7b10e42377b4f76 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 17 Jan 2012 16:43:06 +0000 Subject: [PATCH 031/112] Update normalize and demo from master branch --- demo.html | 2 +- normalize.css | 21 ++++++++++++++++++--- 2 files changed, 19 insertions(+), 4 deletions(-) diff --git a/demo.html b/demo.html index 6fd5c619e..da2854ac5 100644 --- a/demo.html +++ b/demo.html @@ -247,7 +247,7 @@

Forms

- Inputs as descendents of labels (form legend) + Inputs as descendents of labels (form legend). This doubles up as a long legend that can test word wrapping.

diff --git a/normalize.css b/normalize.css index 977681330..1e10e7d79 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2011-11-04T15:38 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-01-17T16:33 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -315,12 +315,15 @@ fieldset { /* * 1. Corrects color not being inherited in IE6/7/8/9 - * 2. Corrects alignment displayed oddly in IE6/7 + * 2. Corrects text not wrapping in FF3 + * 3. Corrects alignment displayed oddly in IE6/7 */ legend { border: 0; /* 1 */ - *margin-left: -7px; /* 2 */ + padding: 0; + white-space: normal; /* 2 */ + *margin-left: -7px; /* 3 */ } /* @@ -367,12 +370,16 @@ input[type="submit"] { /* * 1. Addresses box sizing set to content-box in IE8/9 * 2. Removes excess padding in IE8/9 + * 3. Removes excess padding in IE7 + Known issue: excess padding remains in IE6 */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ + *height: 13px; /* 3 */ + *width: 13px; /* 3 */ } /* @@ -395,6 +402,14 @@ input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } +/* + * Removes search cancel button in S5, Chrome on OS X + */ + +input[type="search"]::-webkit-search-cancel-button { + -webkit-appearance: none; +} + /* * Removes inner padding and border in FF3+ * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ From bfcd8bdd0fa5c52d5e208c72016cce866ccd8882 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Sun, 22 Jan 2012 22:42:18 +0000 Subject: [PATCH 032/112] Project page: update copy and realign --- index.html | 92 +++++++++++++++++++++++++++++++---------------------- style.css | 93 ++++++++++++++++++++++++++++-------------------------- 2 files changed, 104 insertions(+), 81 deletions(-) diff --git a/index.html b/index.html index f605527c5..6fe426cae 100644 --- a/index.html +++ b/index.html @@ -2,7 +2,7 @@ - + Normalize.css: Make browsers render all elements more consistently. @@ -15,59 +15,62 @@

normalize.css

- +

Normalize.css is a customisable CSS file that makes browsers render all elements more consistently and in line with modern standards. We researched the differences between default browser styles in order to precisely target only the styles that need normalizing.

What does it do?

  • Preserves useful defaults, unlike many CSS resets.
    • -
  • Normalizes styles for a wide range of elements.
    • +
  • Normalizes styles for a wide range of elements (including HTML5).
  • Corrects bugs and common browser inconsistencies.
  • Improves usability with subtle improvements.
  • Explains what code does using detailed comments.
- +
Check out the demo

Get the normalize.css file

- -

How to use it

-

You are encouraged to read, edit, customise, add, and trim rulesets or styles from normalize.css on a per project basis.

-

The normalize.css file is not intended to be a mysterious "black box" that is included in a project and then ignored. It should be used as a customisable starting point on any project.

-

Browser support

-

Chrome, Firefox 3+, Safari 4+, Opera 10+, Internet Explorer 6+

- -

Source code

-

Available on GitHub: necolas/normalize.css

-

Download it in either zip or tar formats.

-

Clone the project with Git by running:

- 
$ git clone git://github.com/necolas/normalize.css.git
- -

Acknowledgements

-

Normalize.css is a project by Nicolas Gallagher and Jonathan Neal.

-

Detailed information on default UA styles: Internet Explorer User Agent Style Sheets and CSS2.1 User Agent Style Sheet Defaults

- +

Browser support

+

Chrome, Firefox 3+, Safari 4+, Opera 10+, Internet Explorer 6+

+ +

How do I use it?

+

Normalize.css is intended to be used as an alternative to CSS resets. It's suggested that you read the normalize.css file and consider customising it to meet your needs.

+ +

Who uses it?

+ + +

Source code

+

Available on GitHub: necolas/normalize.css

+ 
$ git clone git://github.com/necolas/normalize.css.git
+ +

Acknowledgements

+

Normalize.css is a project by Nicolas Gallagher and Jonathan Neal. Detailed information on default UA styles: Internet Explorer User Agent Style Sheets and CSS2.1 User Agent Style Sheet Defaults

+

A project by Nicolas Gallagher and Jonathan Neal.

@@ -76,15 +79,30 @@

Acknowledgements

diff --git a/style.css b/style.css index e4066c5bf..ead1b95a6 100644 --- a/style.css +++ b/style.css @@ -1,7 +1,5 @@ html { font-size: 100%; - overflow-y: scroll; - -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } @@ -20,10 +18,10 @@ img { border: 0; } -a { - font-weight:bold; - text-decoration: none; - color: #6EAD1A; +a { + font-weight:bold; + text-decoration: none; + color: #6ead1a; } a:focus { @@ -35,23 +33,28 @@ a:active { outline: 0; } -a:hover, -a:focus, -a:active { - text-decoration: underline; - color: #569107; +a:hover, +a:focus, +a:active { + text-decoration: underline; + color: #569107; } strong { font-weight: bold; } +code, pre { - display: block; - padding: 5px; - margin: 1em 0; font-family: consolas, monospace; font-size: 1em; +} + +pre { + display: block; + padding: 5px; + margin: 1em 0; + font-size: 13px; color: #fff; background: #222; white-space: pre; @@ -62,21 +65,21 @@ pre { ul { list-style: square; padding: 0; - margin: 1.4em 0; + margin: 0 0 1.4em; } li { margin: 0.35em 0; } -h1 { +h1 { margin: 0.25em 0 0.5em; - font-size: 3.5em; + font-size: 3.5em; } -h2 { - margin: 1.25em 0 0.75em; - font-size: 1.5em; +h2 { + margin: 1.25em 0 0.5em; + font-size: 1.5em; } p { @@ -101,31 +104,31 @@ p { } .button { - display: inline-block; - padding: 6px 15px; + display: inline-block; + padding: 6px 15px; border: 1px solid #487310; - margin: 20px 0 0; + margin: 20px 0 0; font-size: 1.375em; line-height: 1.273; - color: #fff; - background: #6EAD1A; - text-shadow:0 1px 1px rgba(0,0,0,0.4); - -moz-border-radius: 5px; + color: #fff; + background: #6ead1a; + text-shadow: 0 1px 1px rgba(0,0,0,0.4); + -moz-border-radius: 5px; border-radius: 5px; - -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.4), - inset 0 1px rgba(255,255,255,0.5), - inset 0 12px rgba(255,255,255,0.2), - inset 0 10px 20px rgba(255,255,255,0.25), + -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.4), + inset 0 1px rgba(255,255,255,0.5), + inset 0 12px rgba(255,255,255,0.2), + inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -12px 25px rgba(0,0,0,0.3); - -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.4), - inset 0 1px rgba(255,255,255,0.5), - inset 0 12px rgba(255,255,255,0.2), - inset 0 10px 20px rgba(255,255,255,0.25), + -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.4), + inset 0 1px rgba(255,255,255,0.5), + inset 0 12px rgba(255,255,255,0.2), + inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -12px 25px rgba(0,0,0,0.3); - box-shadow: 0 1px 3px rgba(0,0,0,0.4), - inset 0 1px rgba(255,255,255,0.5), - inset 0 12px rgba(255,255,255,0.2), - inset 0 10px 10px rgba(255,255,255,0.25), + box-shadow: 0 1px 3px rgba(0,0,0,0.4), + inset 0 1px rgba(255,255,255,0.5), + inset 0 12px rgba(255,255,255,0.2), + inset 0 10px 10px rgba(255,255,255,0.25), inset 0 -12px 25px rgba(0,0,0,0.3); -webkit-transition: all 0.15s; -moz-transition: all 0.15s; @@ -136,14 +139,16 @@ p { .button:hover, .button:focus, .button:active { - text-decoration: none; - color: #fff; + text-decoration: none; + color: #fff; background: #569107; } .share-bar { overflow: hidden; - margin: 40px 0 0; + padding: 0 0 30px; + border-bottom: 2px solid #ccc; + margin: 30px 0 0; *zoom: 1; } @@ -164,11 +169,11 @@ p { body { font-size: 0.875em; } - + h1 { font-size: 3em; } - + .fork { display: none; } From e3a0bf0b43f150f6a0594b948e6602ebbd4a0bc2 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Sun, 22 Jan 2012 23:19:51 +0000 Subject: [PATCH 033/112] Update normalize.css from master branch --- normalize.css | 28 +++++++++++++--------------- 1 file changed, 13 insertions(+), 15 deletions(-) diff --git a/normalize.css b/normalize.css index 1e10e7d79..367436b9d 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2012-01-17T16:33 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-01-22T23:00 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -58,31 +58,21 @@ audio:not([controls]) { /* * 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 + * 2. 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; + -webkit-text-size-adjust: 100%; /* 2 */ + -ms-text-size-adjust: 100%; /* 2 */ } /* * Addresses font-family inconsistency between 'textarea' and other form elements. */ -body, +html, button, input, select, @@ -90,6 +80,14 @@ textarea { font-family: sans-serif; } +/* + * Addresses margins handled incorrectly in IE6/7 + */ + +body { + margin: 0; +} + /* ============================================================================= Links From 849ededd87b8487c509b123d26f57bc6bec92b3c Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 31 Jan 2012 16:07:49 +0000 Subject: [PATCH 034/112] Update normalize.css and demo.html from master branch --- demo.html | 9 ++++++--- normalize.css | 49 +++++++++++++++++++++++++++++++++++++++---------- 2 files changed, 45 insertions(+), 13 deletions(-) diff --git a/demo.html b/demo.html index da2854ac5..a62581017 100644 --- a/demo.html +++ b/demo.html @@ -1,8 +1,8 @@ - + - + Normalize CSS @@ -291,10 +291,13 @@

Forms

+

+

+

@@ -318,7 +321,7 @@

Forms

-
+
diff --git a/normalize.css b/normalize.css index 367436b9d..6f90edd98 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2012-01-22T23:00 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-01-31T16:06 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -118,10 +118,37 @@ a:active { /* * Neutralise smaller font-size in 'section' and 'article' in FF4+, Chrome, S5 + * Fix IE6/7 heading font-size not being relative to the root font-size */ h1 { font-size: 2em; + margin: 0.67em 0; +} + +h2 { + font-size: 1.5em; + margin: 0.83em 0; +} + +h3 { + font-size: 1.17em; + margin: 1em 0; +} + +h4 { + font-size: 1em; + margin: 1.33em 0; +} + +h5 { + font-size: 0.83em; + margin: 1.67em 0; +} + +h6 { + font-size: 0.75em; + margin: 2.33em 0; } /* @@ -365,6 +392,15 @@ input[type="submit"] { *overflow: visible; /* 3 */ } +/* + * Re-set default cursor for disabled elements + */ + +button[disabled], +input[disabled] { + cursor: default; +} + /* * 1. Addresses box sizing set to content-box in IE8/9 * 2. Removes excess padding in IE8/9 @@ -393,17 +429,10 @@ input[type="search"] { } /* - * Removes inner padding that is displayed in S5, Chrome on OS X - */ - -input[type="search"]::-webkit-search-decoration { - -webkit-appearance: none; -} - -/* - * Removes search cancel button in S5, Chrome on OS X + * Removes inner padding and search cancel button in S5, Chrome on OS X */ +input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; } From a16ba668aa8330f07eb3aa092bd4d8cfa8b53ff9 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 7 Feb 2012 01:21:53 +0000 Subject: [PATCH 035/112] Add GOV.UK to list of sites using normalize --- index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/index.html b/index.html index 6fe426cae..172515846 100644 --- a/index.html +++ b/index.html @@ -61,6 +61,7 @@

Who uses it?

From 38f540b338328c910077af97b99434e5e8962f9c Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 7 Feb 2012 01:57:14 +0000 Subject: [PATCH 036/112] Update normalize.css and demo.html from master branch. --- demo.html | 12 ++++++++++++ normalize.css | 31 ++++++++++++++++++++++++++----- 2 files changed, 38 insertions(+), 5 deletions(-) diff --git a/demo.html b/demo.html index a62581017..c75e4b96e 100644 --- a/demo.html +++ b/demo.html @@ -115,6 +115,18 @@

video

+

Interactive content

+ +

details / summary

+
+ More info +

Additional information

+
    +
  • Point 1
    • +
  • Point 2
    • +
+
+

Grouping content

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

diff --git a/normalize.css b/normalize.css index 6f90edd98..e84eef5c2 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2012-01-31T16:06 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-02-07T01:46 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -262,16 +262,37 @@ sub { Lists ========================================================================== */ -ul, -ol { - margin-left: 0; - padding: 0 0 0 40px; +/* + * Addresses margins set differently in IE6/7 + */ + +dl, +menu, +ol, +p, +pre, +ul { + margin: 1em 0; } dd { margin: 0 0 0 40px; } +/* + * Addresses paddings set differently in IE6/7 + */ + +menu, +ol, +ul { + padding: 0 0 0 40px; +} + +/* + * Corrects list images handled incorrectly in IE7 + */ + nav ul, nav ol { list-style: none; From 579ebabe4dc500ce78a6fcd8fdcf948cfbd90bbc Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 7 Feb 2012 11:37:28 +0000 Subject: [PATCH 037/112] Update normalize.css from master branch --- normalize.css | 33 ++++++++++++++++++++------------- 1 file changed, 20 insertions(+), 13 deletions(-) diff --git a/normalize.css b/normalize.css index e84eef5c2..15a8f8170 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2012-02-07T01:46 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-02-07T10:31 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -68,7 +68,7 @@ html { -ms-text-size-adjust: 100%; /* 2 */ } -/* +/* * Addresses font-family inconsistency between 'textarea' and other form elements. */ @@ -117,8 +117,8 @@ a:active { ========================================================================== */ /* - * Neutralise smaller font-size in 'section' and 'article' in FF4+, Chrome, S5 - * Fix IE6/7 heading font-size not being relative to the root font-size + * Addresses font sizes and margins set differently in IE6/7 + * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5 */ h1 { @@ -163,9 +163,9 @@ abbr[title] { * Addresses style set to 'bolder' in FF3+, S4/5, Chrome */ -b, -strong { - font-weight: bold; +b, +strong { + font-weight: bold; } blockquote { @@ -189,6 +189,15 @@ mark { color: #000; } +/* + * Addresses margins set differently in IE6/7 + */ + +p, +pre { + margin: 1em 0; +} + /* * Corrects font family set oddly in IE6, S4/5, Chrome * en.wikipedia.org/wiki/User:Davidgothberg/Test59 @@ -269,8 +278,6 @@ sub { dl, menu, ol, -p, -pre, ul { margin: 1em 0; } @@ -316,7 +323,7 @@ img { } /* - * Corrects overflow displayed oddly in IE9 + * Corrects overflow displayed oddly in IE9 */ svg:not(:root) { @@ -405,8 +412,8 @@ input { */ button, -input[type="button"], -input[type="reset"], +input[type="button"], +input[type="reset"], input[type="submit"] { cursor: pointer; /* 1 */ -webkit-appearance: button; /* 2 */ @@ -484,7 +491,7 @@ textarea { Tables ========================================================================== */ -/* +/* * Remove most spacing between table cells */ From d6ebdb0dbe79d4efb79db96cc547dc90345046b7 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 7 Feb 2012 12:34:03 +0000 Subject: [PATCH 038/112] Update the project page. Change font-family from Calibri to Helvetica Neue font stack. Add a subheading to immediately explain the project. Use cleaner button style. Emphasise viewing the project on GitHub and downloading the file over viewing the demo. Remove the footer and link to our websites/twitter in the credits. --- index.html | 33 +++++++++-------- style.css | 106 ++++++++++++++++++++++++++++++++++------------------- 2 files changed, 85 insertions(+), 54 deletions(-) diff --git a/index.html b/index.html index 172515846..d663431aa 100644 --- a/index.html +++ b/index.html @@ -8,28 +8,32 @@ - + Fork me on GitHub
-

normalize.css

+
+

normalize.css

+

A modern, HTML5-ready, alternative to CSS resets

+

Normalize.css is a customisable CSS file that makes browsers render all elements more consistently and in line with modern standards. We researched the differences between default browser styles in order to precisely target only the styles that need normalizing.

What does it do?

  • Preserves useful defaults, unlike many CSS resets.
    • -
  • Normalizes styles for a wide range of elements (including HTML5).
    • +
  • Normalizes styles for a wide range of HTML elements.
  • Corrects bugs and common browser inconsistencies.
  • Improves usability with subtle improvements.
  • Explains what code does using detailed comments.
-
- Check out the demo -

Get the normalize.css file

+
+ View project on GitHub + Download +

Check out the demo

-

Browser support

-

Chrome, Firefox 3+, Safari 4+, Opera 10+, Internet Explorer 6+

-

How do I use it?

-

Normalize.css is intended to be used as an alternative to CSS resets. It's suggested that you read the normalize.css file and consider customising it to meet your needs.

+

Normalize.css is intended to be used as an alternative to CSS resets. It's suggested that you read the normalize.css file and consider customising it to meet your needs. Alternatively, include the file in your project and override the defaults later in your CSS.

Who uses it?

+

Browser support

+

Chrome, Firefox 3+, Safari 4+, Opera 10+, Internet Explorer 6+

+

Source code

-

Available on GitHub: necolas/normalize.css

+

Available on GitHub: necolas/normalize.css

$ git clone git://github.com/necolas/normalize.css.git

Acknowledgements

-

Normalize.css is a project by Nicolas Gallagher and Jonathan Neal. Detailed information on default UA styles: Internet Explorer User Agent Style Sheets and CSS2.1 User Agent Style Sheet Defaults

- -
-

A project by Nicolas Gallagher and Jonathan Neal.

-
+

Normalize.css is a project by Nicolas Gallagher (@necolas) and Jonathan Neal (@jon_neal).

+

Detailed information on default UA styles: WHATWG suggestions for rendering HTML documents, Internet Explorer User Agent Style Sheets and CSS2.1 User Agent Style Sheet Defaults

diff --git a/style.css b/style.css index ead1b95a6..d9b76c8e7 100644 --- a/style.css +++ b/style.css @@ -6,9 +6,9 @@ html { body { max-width: 480px; - padding: 0 10px; + padding: 0 10px 30px; margin: 0 auto; - font: 1em/1.4 Calibri, sans-serif; + font: 1em/1.5 Helvetica Neue, Helvetica, Arial, sans-serif; color: #222; background: #fff; _width: 480px; @@ -72,6 +72,11 @@ li { margin: 0.35em 0; } +h1, +h2 { + line-height: 1.2; +} + h1 { margin: 0.25em 0 0.5em; font-size: 3.5em; @@ -94,54 +99,86 @@ p { right: 0; } -.demo { +.hgroup h1 { + margin-bottom: 0; +} + +.hgroup h2 { + margin: 0 0 2em; + font-size: 1em; + color: #555; +} + +.cta { margin:1em 0 4em; } -.demo p { +.cta p { margin: 0.5em 0 0; font-style: italic; } .button { + position: relative; display: inline-block; - padding: 6px 15px; + padding: 0.4em 1em; border: 1px solid #487310; - margin: 20px 0 0; + margin: 20px 5px 0 0; font-size: 1.375em; line-height: 1.273; - color: #fff; - background: #6ead1a; - text-shadow: 0 1px 1px rgba(0,0,0,0.4); - -moz-border-radius: 5px; - border-radius: 5px; - -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.4), - inset 0 1px rgba(255,255,255,0.5), - inset 0 12px rgba(255,255,255,0.2), - inset 0 10px 20px rgba(255,255,255,0.25), - inset 0 -12px 25px rgba(0,0,0,0.3); - -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.4), - inset 0 1px rgba(255,255,255,0.5), - inset 0 12px rgba(255,255,255,0.2), - inset 0 10px 20px rgba(255,255,255,0.25), - inset 0 -12px 25px rgba(0,0,0,0.3); - box-shadow: 0 1px 3px rgba(0,0,0,0.4), - inset 0 1px rgba(255,255,255,0.5), - inset 0 12px rgba(255,255,255,0.2), - inset 0 10px 10px rgba(255,255,255,0.25), - inset 0 -12px 25px rgba(0,0,0,0.3); - -webkit-transition: all 0.15s; - -moz-transition: all 0.15s; - -o-transition: all 0.15s; - transition: all 0.15s; + font-weight: normal; + text-align: center; + text-decoration: none; + white-space: nowrap; + border: 1px solid #d9d9d9; + border-radius: 2px; + color: #555; + background: #f5f5f5; + background-image: -webkit-linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.1)); + background-image: -moz-linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.1)); + background-image: -ms-linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.1)); + background-image: -o-linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.1)); + /* IE6/7 inline-block hack */ + *display: inline; + *zoom: 1; } .button:hover, .button:focus, .button:active { text-decoration: none; + border-color: #c6c6c6; + color: #333; + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); + background-color: #f8f8f8; +} + +.button:focus { + border-color: #105cb6; + outline: 0; +} + +.button:active { + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); + background-color: #eee; +} + +.button-main { + border-color: #5e9612; color: #fff; - background: #569107; + background-color: #69a619; +} + +.button-main:hover, +.button-main:focus, +.button-main:active { + border-color: #558713; + color: #fff; + background-color: #6ead1a; +} + +.button-main:active { + background-color: #5D9117; } .share-bar { @@ -158,13 +195,6 @@ p { vertical-align: bottom; } -.footer { - padding: 10px 0; - border-top: 1px solid #ccc; - margin: 3em 0 0; - font-size: 0.8125em; -} - @media screen and (max-width:480px) { body { font-size: 0.875em; From a95ad2e739c7a1cdbe3cfb09e86b4a88552c737d Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 7 Feb 2012 12:40:44 +0000 Subject: [PATCH 039/112] Update normalize.css from master branch --- normalize.css | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/normalize.css b/normalize.css index 15a8f8170..eecef924f 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2012-02-07T10:31 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-02-07T12:37 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -17,7 +17,8 @@ footer, header, hgroup, nav, -section { +section, +summary { display: block; } From d44a4ca9010bd543afdd469ab3bfaf488a94dd6e Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Thu, 16 Feb 2012 23:03:19 +0000 Subject: [PATCH 040/112] Add tinker.io to list of projects using normalize --- index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/index.html b/index.html index d663431aa..6b3a2f3e6 100644 --- a/index.html +++ b/index.html @@ -64,6 +64,7 @@

Who uses it?

  • Twitter Bootstrap
  • GOV.UK
  • CSS Tricks
    • +
  • Tinker.io

    • Browser support

    From 4ad96eec8839f0cb060a4a291d96496536707fb9 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Sun, 26 Feb 2012 13:44:39 +0000 Subject: [PATCH 041/112] Modify subheading and tweet text --- index.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index 6b3a2f3e6..edeb3adff 100644 --- a/index.html +++ b/index.html @@ -9,14 +9,14 @@ - Fork me on GitHub + Fork this project on GitHub

    normalize.css

    -

    A modern, HTML5-ready, alternative to CSS resets

    +

    A modern, HTML5-ready alternative to CSS resets

    Normalize.css is a customisable CSS file that makes browsers render all elements more consistently and in line with modern standards. We researched the differences between default browser styles in order to precisely target only the styles that need normalizing.

    @@ -41,7 +41,7 @@

    What does it do?

    @@ -72,7 +72,7 @@

    Browser support

    Source code

    Available on GitHub: necolas/normalize.css

    - 
    $ git clone git://github.com/necolas/normalize.css.git
    + 
    $ git clone git://github.com/necolas/normalize.css.git

    Acknowledgements

    Normalize.css is a project by Nicolas Gallagher (@necolas) and Jonathan Neal (@jon_neal).

    From 2d91c531e48978dd59f4af5ba22c293c3469bdec Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 6 Mar 2012 10:27:56 +0000 Subject: [PATCH 042/112] Update normalize.css from master branch --- normalize.css | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/normalize.css b/normalize.css index eecef924f..f056d583a 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2012-02-07T12:37 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-03-06T10:21 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -36,10 +36,12 @@ video { /* * Prevents modern browsers from displaying 'audio' without controls + * Remove excess height in iOS5 devices */ audio:not([controls]) { display: none; + height: 0; } /* @@ -369,7 +371,7 @@ fieldset { /* * 1. Corrects color not being inherited in IE6/7/8/9 - * 2. Corrects text not wrapping in FF3 + * 2. Corrects text not wrapping in FF3 * 3. Corrects alignment displayed oddly in IE6/7 */ From 88a213a1e60725103e338fc710da06f6bb930da1 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Fri, 9 Mar 2012 22:14:58 +0000 Subject: [PATCH 043/112] Update normalize.css from master branch --- normalize.css | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/normalize.css b/normalize.css index f056d583a..05fd5ad64 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2012-03-06T10:21 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-03-09T22:11 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -489,6 +489,22 @@ textarea { vertical-align: top; /* 2 */ } +/* + * Addresses placeholder color unset in Firefox + */ + +:-moz-placeholder { + color: #a9a9a9; +} + +/* + * Addresses placeholder text remaining visible on focus in Chrome + */ + +:focus::-webkit-input-placeholder { + color: transparent; +} + /* ============================================================================= Tables From c2aa9c5ac4bdf1cec8e2e83c3177488eb8da54f6 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Sun, 11 Mar 2012 13:04:08 +0000 Subject: [PATCH 044/112] Update normalize.css from master branch --- normalize.css | 18 +----------------- 1 file changed, 1 insertion(+), 17 deletions(-) diff --git a/normalize.css b/normalize.css index 05fd5ad64..4474dee25 100644 --- a/normalize.css +++ b/normalize.css @@ -1,4 +1,4 @@ -/*! normalize.css 2012-03-09T22:11 UTC - http://github.com/necolas/normalize.css */ +/*! normalize.css 2012-03-11T12:53 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions @@ -489,22 +489,6 @@ textarea { vertical-align: top; /* 2 */ } -/* - * Addresses placeholder color unset in Firefox - */ - -:-moz-placeholder { - color: #a9a9a9; -} - -/* - * Addresses placeholder text remaining visible on focus in Chrome - */ - -:focus::-webkit-input-placeholder { - color: transparent; -} - /* ============================================================================= Tables From d25b4db223bfc384d3def31812a56cbd3047df8c Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Wed, 2 May 2012 17:03:34 -0700 Subject: [PATCH 045/112] Add Rdio to sites using normalize --- index.html | 12 +----------- 1 file changed, 1 insertion(+), 11 deletions(-) diff --git a/index.html b/index.html index edeb3adff..22acbeb7f 100644 --- a/index.html +++ b/index.html @@ -8,10 +8,6 @@ - - Fork this project on GitHub - -
    @@ -59,13 +55,7 @@

    How do I use it?

    Normalize.css is intended to be used as an alternative to CSS resets. It's suggested that you read the normalize.css file and consider customising it to meet your needs. Alternatively, include the file in your project and override the defaults later in your CSS.

    Who uses it?

    - +

    HTML5 Boilerplate, Twitter Bootstrap, Rdio, GOV.UK, CSS Tricks, and many others.

    Browser support

    Chrome, Firefox 3+, Safari 4+, Opera 10+, Internet Explorer 6+

    From f051052df92f23f50fb6c4601d0ba5a4493cdd51 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Sat, 9 Jun 2012 10:03:01 +0100 Subject: [PATCH 046/112] Add iA to sites using normalize.css --- index.html | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index 22acbeb7f..c4b2b161e 100644 --- a/index.html +++ b/index.html @@ -55,7 +55,15 @@

    How do I use it?

    Normalize.css is intended to be used as an alternative to CSS resets. It's suggested that you read the normalize.css file and consider customising it to meet your needs. Alternatively, include the file in your project and override the defaults later in your CSS.

    Who uses it?

    -

    HTML5 Boilerplate, Twitter Bootstrap, Rdio, GOV.UK, CSS Tricks, and many others.

    +

    + Twitter Bootstrap, + HTML5 Boilerplate, + Rdio, + GOV.UK, + iA, + CSS Tricks, + and many others. +

    Browser support

    Chrome, Firefox 3+, Safari 4+, Opera 10+, Internet Explorer 6+

    From 03e1bf20f7fa8d78af3bda1516e92a865acea615 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Tue, 7 Aug 2012 22:31:46 +0100 Subject: [PATCH 047/112] Add Digg to sites using normalize.css Includes updating normalize.css to the latest version from 'master'. --- index.html | 5 +- normalize.css | 176 ++++++++++++++++++++++++-------------------------- 2 files changed, 89 insertions(+), 92 deletions(-) diff --git a/index.html b/index.html index c4b2b161e..ce05c9828 100644 --- a/index.html +++ b/index.html @@ -59,9 +59,10 @@

    Who uses it?

    Twitter Bootstrap, HTML5 Boilerplate, Rdio, + Digg, GOV.UK, iA, - CSS Tricks, + CSS Tricks, and many others.

    @@ -82,7 +83,7 @@

    Acknowledgements

    + + + +

    Heading 1

    +

    Heading 2

    +

    Heading 3

    +

    Heading 4

    +
    Heading 5
    +
    Heading 6
    + +
    +

    Heading 1 (in section)

    +

    Heading 2 (in section)

    +

    Heading 3 (in section)

    +

    Heading 4 (in section)

    +
    Heading 5 (in section)
    +
    Heading 6 (in section)
    +
    + +
    +

    Heading 1 (in article)

    +

    Heading 2 (in article)

    +

    Heading 3 (in article)

    +

    Heading 4 (in article)

    +
    Heading 5 (in article)
    +
    Heading 6 (in article)
    +
    + +
    +
    +

    Heading 1 (in hgroup)

    +

    Heading 2 (in hgroup)

    +
    + +
    + +

    Text-level semantics

    + + + +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    + +
    Address: somewhere, world
    + +

    + The a element example
    + The abbr element and abbr element with title examples
    + The b element example
    + The cite element example
    + The code element example
    + The del element example
    + The dfn element and dfn element with title examples
    + The em element example
    + The i element example
    + The img element example
    + The ins element example
    + The kbd element example
    + The mark element example
    + The q element inside a q element example
    + The s element example
    + The samp element example
    + The small element example
    + The span element example
    + The strong element example
    + The sub element example
    + The sup element example
    + The u element example
    + The var element example +

    + +

    Embedded content

    + +

    audio

    + + + + +

    img

    + + + + +

    svg

    + + + + + +

    video

    + + + + +

    Interactive content

    + +

    details / summary

    +
    + More info +

    Additional information

    +
      +
    • Point 1
      • +
    • Point 2
      • +
    +
    + +

    Grouping content

    + +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    + +

    pre

    + + 
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.
    + + 
    <html>
+    <head>
+    </head>
+    <body>
+        <div class="main"> <div>
+    </body>
+</html>
    + +

    blockquote

    + +
    +

    Some sort of famous witty quote marked up with a <blockquote> and a child <p> element.

    +
    + +
    Even better philosophical quote marked up with just a <blockquote> element.
    + +

    ordered list

    + +
      +
    1. list item 1
      2. +
    2. list item 1 +
        +
      1. list item 2
        2. +
      2. list item 2 +
          +
        1. list item 3
          2. +
        2. list item 3
          3. +
        +
        3. +
      3. list item 2
        4. +
      4. list item 2
        5. +
      +
      3. +
    3. list item 1
      4. +
    4. list item 1
      5. +
    + +

    unordered list

    + +
      +
    • list item 1
      • +
    • list item 1 +
        +
      • list item 2
        • +
      • list item 2 +
          +
        • list item 3
          • +
        • list item 3
          • +
        +
        • +
      • list item 2
        • +
      • list item 2
        • +
      +
      • +
    • list item 1
      • +
    • list item 1
      • +
    + +

    description list

    + +
    +
    Description name
    +
    Description value
    +
    Description name
    +
    Description value
    +
    Description value
    +
    Description name
    +
    Description name
    +
    Description value
    +
    + +

    figure

    + +
    + +
    Figcaption content
    +
    + +

    Tabular data

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    Jimi Hendrix - albums
    AlbumYearPrice
    AlbumYearPrice
    Are You Experienced1967$10.00
    Axis: Bold as Love1967$12.00
    Electric Ladyland1968$10.00
    Band of Gypsys1970$12.00
    + +

    Forms

    + + +
    + Inputs as descendents of labels (form legend). This doubles up as a long legend that can test word wrapping. +

    +

    +

    +

    +

    +

    +

    + +

    +

    +

    +

    + +

    +

    +
    + +
    + Inputs as siblings of labels +

    +

    +

    +

    +

    +

    +

    +

    + +

    +

    +

    +

    + +

    +

    +
    + +
    + Clickable inputs and buttons +

    +

    +

    +

    +

    + + +

    +

    +

    +

    +
    + +
    + box-sizing tests +
    +
    +
    +
    +
    + +
    +
    +
    +
    +
    +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    +
    + +
    +
    +
    +
    + + + + diff --git a/2.0.0/normalize.css b/2.0.0/normalize.css new file mode 100644 index 000000000..4c3a36d5a --- /dev/null +++ b/2.0.0/normalize.css @@ -0,0 +1,377 @@ +/*! normalize.css v2.0.0 | MIT License | git.io/normalize */ + +/* ========================================================================== + HTML5 display definitions + ========================================================================== */ + +/* + * Corrects `block` display not defined in IE 8/9. + */ + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +nav, +section, +summary { + display: block; +} + +/* + * Corrects `inline-block` display not defined in IE 8/9. + */ + +audio, +canvas, +video { + display: inline-block; + *display: inline; + *zoom: 1; +} + +/* + * Prevents modern browsers from displaying `audio` without controls. + * Remove excess height in iOS 5 devices. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/* + * Addresses styling for `hidden` attribute not present in IE 8/9. + */ + +[hidden] { + display: none; +} + +/* ========================================================================== + Base + ========================================================================== */ + +/* + * 1. Sets default font family to sans-serif. + * 2. Prevents iOS text size adjust after orientation change, without disabling + * user zoom. + */ + +html { + font-family: sans-serif; /* 1 */ + -webkit-text-size-adjust: 100%; /* 2 */ + -ms-text-size-adjust: 100%; /* 2 */ +} + +/* + * Removes default margin. + */ + +body { + margin: 0; +} + +/* ========================================================================== + Links + ========================================================================== */ + +/* + * Addresses `outline` inconsistency between Chrome and other browsers. + */ + +a:focus { + outline: thin dotted; +} + +/* + * Improves readability when focused and also mouse hovered in all browsers. + */ + +a:active, +a:hover { + outline: 0; +} + +/* ========================================================================== + Typography + ========================================================================== */ + +/* + * Addresses `h1` font sizes within `section` and `article` in Firefox 4+, + * Safari 5, and Chrome. + */ + +h1 { + font-size: 2em; +} + +/* + * Addresses styling not present in IE 8/9, Safari 5, and Chrome. + */ + +abbr[title] { + border-bottom: 1px dotted; +} + +/* + * Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome. + */ + +b, +strong { + font-weight: bold; +} + +/* + * Addresses styling not present in Safari 5 and Chrome. + */ + +dfn { + font-style: italic; +} + +/* + * Addresses styling not present in IE 8/9. + */ + +mark { + background: #ff0; + color: #000; +} + + +/* + * Corrects font family set oddly in Safari 5 and Chrome. + */ + +code, +kbd, +pre, +samp { + font-family: monospace, serif; + font-size: 1em; +} + +/* + * Improves readability of pre-formatted text in all browsers. + */ + +pre { + white-space: pre; + white-space: pre-wrap; + word-wrap: break-word; +} + +/* + * Sets consistent quote types. + */ + +q { + quotes: "\201C" "\201D" "\2018" "\2019"; +} + +/* + * Addresses inconsistent and variable font size in all browsers. + */ + +small { + font-size: 80%; +} + +/* + * Prevents `sub` and `sup` affecting `line-height` in all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +/* ========================================================================== + Embedded content + ========================================================================== */ + +/* + * Removes border when inside `a` element in IE 8/9. + */ + +img { + border: 0; +} + +/* + * Corrects overflow displayed oddly in IE 9. + */ + +svg:not(:root) { + overflow: hidden; +} + +/* ========================================================================== + Figures + ========================================================================== */ + +/* + * Addresses margin not present in IE 8/9 and Safari 5. + */ + +figure { + margin: 0; +} + +/* ========================================================================== + Forms + ========================================================================== */ + +/* + * Define consistent border, margin, and padding. + */ + +fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} + +/* + * 1. Corrects color not being inherited in IE 8/9. + * 2. Remove padding so people aren't caught out if they zero out fieldsets. + */ + +legend { + border: 0; /* 1 */ + padding: 0; /* 2 */ +} + +/* + * 1. Corrects font family not being inherited in all browsers. + * 2. Corrects font size not being inherited in all browsers. + * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome + */ + +button, +input, +select, +textarea { + font-family: inherit; /* 1 */ + font-size: 100%; /* 2 */ + margin: 0; /* 3 */ +} + +/* + * Addresses Firefox 4+ setting `line-height` on `input` using `!important` in + * the UA stylesheet. + */ + +button, +input { + line-height: normal; +} + +/* + * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` + * and `video` controls. + * 2. Corrects inability to style clickable `input` types in iOS. + * 3. Improves usability and consistency of cursor style between image-type + * `input` and others. + */ + +button, +html input[type="button"], /* 1 */ +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; /* 2 */ + cursor: pointer; /* 3 */ +} + +/* + * Re-set default cursor for disabled elements. + */ + +button[disabled], +input[disabled] { + cursor: default; +} + +/* + * 1. Addresses box sizing set to `content-box` in IE 8/9. + * 2. Removes excess padding in IE 8/9. + */ + +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/* + * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome. + * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome + * (include `-moz` to future-proof). + */ + +input[type="search"] { + -webkit-appearance: textfield; /* 1 */ + -moz-box-sizing: content-box; + -webkit-box-sizing: content-box; /* 2 */ + box-sizing: content-box; +} + +/* + * Removes inner padding and search cancel button in Safari 5 and Chrome + * on OS X. + */ + +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/* + * Removes inner padding and border in Firefox 4+. + */ + +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} + +/* + * 1. Removes default vertical scrollbar in IE 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; +} diff --git a/2.0.0/test.html b/2.0.0/test.html new file mode 100644 index 000000000..750e5470d --- /dev/null +++ b/2.0.0/test.html @@ -0,0 +1,350 @@ + + + + + + Normalize CSS + + + + + +

    Heading 1

    +

    Heading 2

    +

    Heading 3

    +

    Heading 4

    +
    Heading 5
    +
    Heading 6
    + +
    +

    Heading 1 (in section)

    +

    Heading 2 (in section)

    +

    Heading 3 (in section)

    +

    Heading 4 (in section)

    +
    Heading 5 (in section)
    +
    Heading 6 (in section)
    +
    + +
    +

    Heading 1 (in article)

    +

    Heading 2 (in article)

    +

    Heading 3 (in article)

    +

    Heading 4 (in article)

    +
    Heading 5 (in article)
    +
    Heading 6 (in article)
    +
    + +
    +
    +

    Heading 1 (in hgroup)

    +

    Heading 2 (in hgroup)

    +
    + +
    + +

    Text-level semantics

    + + + +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    + +
    Address: somewhere, world
    + +

    + The a element example
    + The abbr element and abbr element with title examples
    + The b element example
    + The cite element example
    + The code element example
    + The del element example
    + The dfn element and dfn element with title examples
    + The em element example
    + The i element example
    + The img element example
    + The ins element example
    + The kbd element example
    + The mark element example
    + The q element inside a q element example
    + The s element example
    + The samp element example
    + The small element example
    + The span element example
    + The strong element example
    + The sub element example
    + The sup element example
    + The u element example
    + The var element example +

    + +

    Embedded content

    + +

    audio

    + + + + +

    img

    + + + + +

    svg

    + + + + + +

    video

    + + + + +

    Interactive content

    + +

    details / summary

    +
    + More info +

    Additional information

    +
      +
    • Point 1
      • +
    • Point 2
      • +
    +
    + +

    Grouping content

    + +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    + +

    pre

    + + 
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.
    + + 
    <html>
+    <head>
+    </head>
+    <body>
+        <div class="main"> <div>
+    </body>
+</html>
    + +

    blockquote

    + +
    +

    Some sort of famous witty quote marked up with a <blockquote> and a child <p> element.

    +
    + +
    Even better philosophical quote marked up with just a <blockquote> element.
    + +

    ordered list

    + +
      +
    1. list item 1
      2. +
    2. list item 1 +
        +
      1. list item 2
        2. +
      2. list item 2 +
          +
        1. list item 3
          2. +
        2. list item 3
          3. +
        +
        3. +
      3. list item 2
        4. +
      4. list item 2
        5. +
      +
      3. +
    3. list item 1
      4. +
    4. list item 1
      5. +
    + +

    unordered list

    + +
      +
    • list item 1
      • +
    • list item 1 +
        +
      • list item 2
        • +
      • list item 2 +
          +
        • list item 3
          • +
        • list item 3
          • +
        +
        • +
      • list item 2
        • +
      • list item 2
        • +
      +
      • +
    • list item 1
      • +
    • list item 1
      • +
    + +

    description list

    + +
    +
    Description name
    +
    Description value
    +
    Description name
    +
    Description value
    +
    Description value
    +
    Description name
    +
    Description name
    +
    Description value
    +
    + +

    figure

    + +
    + +
    Figcaption content
    +
    + +

    Tabular data

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    Jimi Hendrix - albums
    AlbumYearPrice
    AlbumYearPrice
    Are You Experienced1967$10.00
    Axis: Bold as Love1967$12.00
    Electric Ladyland1968$10.00
    Band of Gypsys1970$12.00
    + +

    Forms

    + +
    +
    + Inputs as descendents of labels (form legend). This doubles up as a long legend that can test word wrapping. +

    +

    +

    +

    +

    +

    +

    + +

    +

    +

    +

    + +

    +

    +
    + +
    + Inputs as siblings of labels +

    +

    +

    +

    +

    +

    +

    +

    + +

    +

    +

    +

    + +

    +

    +
    + +
    + Clickable inputs and buttons +

    +

    +

    +

    +

    + + +

    +

    +

    +

    +
    + +
    + box-sizing tests +
    +
    +
    +
    +
    + +
    +
    +
    +
    +
    +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    +
    + +
    +
    +
    +
    +
    + + + diff --git a/index.html b/index.html index f6d269830..9ffc8bad6 100644 --- a/index.html +++ b/index.html @@ -4,83 +4,81 @@ Normalize.css: Make browsers render all elements more consistently. - + + + - -
    - -
    -

    normalize.css

    -

    A modern, HTML5-ready alternative to CSS resets

    -
    - -

    Normalize.css is a customisable CSS file that makes browsers render all elements more consistently and in line with modern standards. We researched the differences between default browser styles in order to precisely target only the styles that need normalizing.

    - -

    What does it do?

    -
      -
    • Preserves useful defaults, unlike many CSS resets.
      • -
    • Normalizes styles for a wide range of HTML elements.
      • -
    • Corrects bugs and common browser inconsistencies.
      • -
    • Improves usability with subtle improvements.
      • -
    • Explains what code does using detailed comments.
      • -
    +
    +
    +
    +

    Normalize.css

    +

    A modern, HTML5-ready alternative to CSS resets

    +
    -
    - Download v1.0.0 - View on GitHub -
    +

    Normalize.css makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.

    -
    @@ -33,7 +35,9 @@

    A modern, HTML5-ready alternative to CSS resets

    Download v1.0.2 -

    Includes legacy browser support

    +
    Includes legacy browser support
    + See the CHANGELOG
    -

    Normalize.css makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.

    +

    Normalize.css makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.

    Date: Sun, 20 Jan 2013 17:50:37 -0800 Subject: [PATCH 062/112] Add v1.1.0 of normalize.css --- 1.1.0/normalize.css | 527 ++++++++++++++++++++++++++++++++++++++++++++ 1.1.0/test.html | 354 +++++++++++++++++++++++++++++ index.html | 8 +- 3 files changed, 885 insertions(+), 4 deletions(-) create mode 100644 1.1.0/normalize.css create mode 100644 1.1.0/test.html diff --git a/1.1.0/normalize.css b/1.1.0/normalize.css new file mode 100644 index 000000000..4d4d01d15 --- /dev/null +++ b/1.1.0/normalize.css @@ -0,0 +1,527 @@ +/*! normalize.css v1.1.0 | MIT License | git.io/normalize */ + +/* ========================================================================== + HTML5 display definitions + ========================================================================== */ + +/** + * Correct `block` display not defined in IE 6/7/8/9 and Firefox 3. + */ + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +main, +nav, +section, +summary { + display: block; +} + +/** + * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. + */ + +audio, +canvas, +video { + display: inline-block; + *display: inline; + *zoom: 1; +} + +/** + * Prevent modern browsers from displaying `audio` without controls. + * Remove excess height in iOS 5 devices. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4. + * Known issue: no IE 6 support. + */ + +[hidden] { + display: none; +} + +/* ========================================================================== + Base + ========================================================================== */ + +/** + * 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using + * `em` units. + * 2. Prevent iOS text size adjust after orientation change, without disabling + * user zoom. + */ + +html { + font-size: 100%; /* 1 */ + -webkit-text-size-adjust: 100%; /* 2 */ + -ms-text-size-adjust: 100%; /* 2 */ +} + +/** + * Address `font-family` inconsistency between `textarea` and other form + * elements. + */ + +html, +button, +input, +select, +textarea { + font-family: sans-serif; +} + +/** + * Address margins handled incorrectly in IE 6/7. + */ + +body { + margin: 0; +} + +/* ========================================================================== + Links + ========================================================================== */ + +/** + * Address `outline` inconsistency between Chrome and other browsers. + */ + +a:focus { + outline: thin dotted; +} + +/** + * Improve readability when focused and also mouse hovered in all browsers. + */ + +a:active, +a:hover { + outline: 0; +} + +/* ========================================================================== + Typography + ========================================================================== */ + +/** + * Address font sizes and margins set differently in IE 6/7. + * Address font sizes within `section` and `article` in Firefox 4+, Safari 5, + * and Chrome. + */ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +h2 { + font-size: 1.5em; + margin: 0.83em 0; +} + +h3 { + font-size: 1.17em; + margin: 1em 0; +} + +h4 { + font-size: 1em; + margin: 1.33em 0; +} + +h5 { + font-size: 0.83em; + margin: 1.67em 0; +} + +h6 { + font-size: 0.67em; + margin: 2.33em 0; +} + +/** + * Address styling not present in IE 7/8/9, Safari 5, and Chrome. + */ + +abbr[title] { + border-bottom: 1px dotted; +} + +/** + * Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. + */ + +b, +strong { + font-weight: bold; +} + +blockquote { + margin: 1em 40px; +} + +/** + * Address styling not present in Safari 5 and Chrome. + */ + +dfn { + font-style: italic; +} + +/** + * Address differences between Firefox and other browsers. + * Known issue: no IE 6/7 normalization. + */ + +hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; +} + +/** + * Address styling not present in IE 6/7/8/9. + */ + +mark { + background: #ff0; + color: #000; +} + +/** + * Address margins set differently in IE 6/7. + */ + +p, +pre { + margin: 1em 0; +} + +/** + * Correct font family set oddly in IE 6, Safari 4/5, and Chrome. + */ + +code, +kbd, +pre, +samp { + font-family: monospace, serif; + _font-family: 'courier new', monospace; + font-size: 1em; +} + +/** + * Improve readability of pre-formatted text in all browsers. + */ + +pre { + white-space: pre; + white-space: pre-wrap; + word-wrap: break-word; +} + +/** + * Address CSS quotes not supported in IE 6/7. + */ + +q { + quotes: none; +} + +/** + * Address `quotes` property not supported in Safari 4. + */ + +q:before, +q:after { + content: ''; + content: none; +} + +/** + * Address inconsistent and variable font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` affecting `line-height` in all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +/* ========================================================================== + Lists + ========================================================================== */ + +/** + * Address margins set differently in IE 6/7. + */ + +dl, +menu, +ol, +ul { + margin: 1em 0; +} + +dd { + margin: 0 0 0 40px; +} + +/** + * Address paddings set differently in IE 6/7. + */ + +menu, +ol, +ul { + padding: 0 0 0 40px; +} + +/** + * Correct list images handled incorrectly in IE 7. + */ + +nav ul, +nav ol { + list-style: none; + list-style-image: none; +} + +/* ========================================================================== + Embedded content + ========================================================================== */ + +/** + * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3. + * 2. Improve image quality when scaled in IE 7. + */ + +img { + border: 0; /* 1 */ + -ms-interpolation-mode: bicubic; /* 2 */ +} + +/** + * Correct overflow displayed oddly in IE 9. + */ + +svg:not(:root) { + overflow: hidden; +} + +/* ========================================================================== + Figures + ========================================================================== */ + +/** + * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11. + */ + +figure { + margin: 0; +} + +/* ========================================================================== + Forms + ========================================================================== */ + +/** + * Correct margin displayed oddly in IE 6/7. + */ + +form { + margin: 0; +} + +/** + * Define consistent border, margin, and padding. + */ + +fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} + +/** + * 1. Correct color not being inherited in IE 6/7/8/9. + * 2. Correct text not wrapping in Firefox 3. + * 3. Correct alignment displayed oddly in IE 6/7. + */ + +legend { + border: 0; /* 1 */ + padding: 0; + white-space: normal; /* 2 */ + *margin-left: -7px; /* 3 */ +} + +/** + * 1. Correct font size not being inherited in all browsers. + * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5, + * and Chrome. + * 3. Improve 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 */ +} + +/** + * Address Firefox 3+ setting `line-height` on `input` using `!important` in + * the UA stylesheet. + */ + +button, +input { + line-height: normal; +} + +/** + * Address inconsistent `text-transform` inheritance for `button` and `select`. + * All other form control elements do not inherit `text-transform` values. + * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+. + * Correct `select` style inheritance in Firefox 4+ and Opera. + */ + +button, +select { + text-transform: none; +} + +/** + * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` + * and `video` controls. + * 2. Correct inability to style clickable `input` types in iOS. + * 3. Improve usability and consistency of cursor style between image-type + * `input` and others. + * 4. Remove inner spacing in IE 7 without affecting normal text inputs. + * Known issue: inner spacing remains in IE 6. + */ + +button, +html input[type="button"], /* 1 */ +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; /* 2 */ + cursor: pointer; /* 3 */ + *overflow: visible; /* 4 */ +} + +/** + * Re-set default cursor for disabled elements. + */ + +button[disabled], +html input[disabled] { + cursor: default; +} + +/** + * 1. Address box sizing set to content-box in IE 8/9. + * 2. Remove excess padding in IE 8/9. + * 3. Remove excess padding in IE 7. + * Known issue: excess padding remains in IE 6. + */ + +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ + *height: 13px; /* 3 */ + *width: 13px; /* 3 */ +} + +/** + * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. + * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome + * (include `-moz` to future-proof). + */ + +input[type="search"] { + -webkit-appearance: textfield; /* 1 */ + -moz-box-sizing: content-box; + -webkit-box-sizing: content-box; /* 2 */ + box-sizing: content-box; +} + +/** + * Remove inner padding and search cancel button in Safari 5 and Chrome + * on OS X. + */ + +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * Remove inner padding and border in Firefox 3+. + */ + +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} + +/** + * 1. Remove default vertical scrollbar in IE 6/7/8/9. + * 2. Improve 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; +} diff --git a/1.1.0/test.html b/1.1.0/test.html new file mode 100644 index 000000000..d7103c49b --- /dev/null +++ b/1.1.0/test.html @@ -0,0 +1,354 @@ + + + + + + Normalize CSS + + + + + +

    Heading 1

    +

    Heading 2

    +

    Heading 3

    +

    Heading 4

    +
    Heading 5
    +
    Heading 6
    + +
    +

    Heading 1 (in section)

    +

    Heading 2 (in section)

    +

    Heading 3 (in section)

    +

    Heading 4 (in section)

    +
    Heading 5 (in section)
    +
    Heading 6 (in section)
    +
    + +
    +

    Heading 1 (in article)

    +

    Heading 2 (in article)

    +

    Heading 3 (in article)

    +

    Heading 4 (in article)

    +
    Heading 5 (in article)
    +
    Heading 6 (in article)
    +
    + +
    +
    +

    Heading 1 (in hgroup)

    +

    Heading 2 (in hgroup)

    +
    +     +
    + +

    Text-level semantics

    + + + +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    + +
    Address: somewhere, world
    + +
    + +
    + +

    + The a element example
    + The abbr element and abbr element with title examples
    + The b element example
    + The cite element example
    + The code element example
    + The del element example
    + The dfn element and dfn element with title examples
    + The em element example
    + The i element example
    + The img element example
    + The ins element example
    + The kbd element example
    + The mark element example
    + The q element inside a q element example
    + The s element example
    + The samp element example
    + The small element example
    + The span element example
    + The strong element example
    + The sub element example
    + The sup element example
    + The u element example
    + The var element example +

    + +

    Embedded content

    + +

    audio

    + + + + +

    img

    + + + + +

    svg

    + + + + + +

    video

    + + + + +

    Interactive content

    + +

    details / summary

    +
    + More info +

    Additional information

    +
      +
    • Point 1
      • +
    • Point 2
      • +
    +
    + +

    Grouping content

    + +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.

    + +

    pre

    + + 
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.
    + + 
    <html>
+    <head>
+    </head>
+    <body>
+        <div class="main"> <div>
+    </body>
+</html>
    + +

    blockquote

    + +
    +

    Some sort of famous witty quote marked up with a <blockquote> and a child <p> element.

    +
    + +
    Even better philosophical quote marked up with just a <blockquote> element.
    + +

    ordered list

    + +
      +
    1. list item 1
      2. +
    2. list item 1 +
        +
      1. list item 2
        2. +
      2. list item 2 +
          +
        1. list item 3
          2. +
        2. list item 3
          3. +
        +
        3. +
      3. list item 2
        4. +
      4. list item 2
        5. +
      +
      3. +
    3. list item 1
      4. +
    4. list item 1
      5. +
    + +

    unordered list

    + +
      +
    • list item 1
      • +
    • list item 1 +
        +
      • list item 2
        • +
      • list item 2 +
          +
        • list item 3
          • +
        • list item 3
          • +
        +
        • +
      • list item 2
        • +
      • list item 2
        • +
      +
      • +
    • list item 1
      • +
    • list item 1
      • +
    + +

    description list

    + +
    +
    Description name
    +
    Description value
    +
    Description name
    +
    Description value
    +
    Description value
    +
    Description name
    +
    Description name
    +
    Description value
    +
    + +

    figure

    + +
    + +
    Figcaption content
    +
    + +

    Tabular data

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    Jimi Hendrix - albums
    AlbumYearPrice
    AlbumYearPrice
    Are You Experienced1967$10.00
    Axis: Bold as Love1967$12.00
    Electric Ladyland1968$10.00
    Band of Gypsys1970$12.00
    + +

    Forms

    + +
    +
    + Inputs as descendents of labels (form legend). This doubles up as a long legend that can test word wrapping. +

    +

    +

    +

    +

    +

    +

    + +

    +

    +

    +

    + +

    +

    +
    + +
    + Inputs as siblings of labels +

    +

    +

    +

    +

    +

    +

    +

    + +

    +

    +

    +

    + +

    +

    +
    + +
    + Clickable inputs and buttons +

    +

    +

    +

    +

    + + +

    +

    +

    +

    +
    + +
    + box-sizing tests +
    +
    +
    +
    +
    + +
    +
    +
    +
    +
    +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    +
    + +
    +
    +
    +
    +
    + + + diff --git a/index.html b/index.html index ccff893a9..9e2f05c74 100644 --- a/index.html +++ b/index.html @@ -5,7 +5,7 @@ Normalize.css: Make browsers render all elements more consistently. - + @@ -31,13 +31,13 @@

    A modern, HTML5-ready alternative to CSS resets

    + href="http://necolas.github.com/normalize.css/1.1.0/normalize.css"> Download - v1.0.2 + v1.1.0
    Includes legacy browser support
    See the CHANGELOG + href="https://github.com/necolas/normalize.css/blob/v1.1.0/CHANGELOG.md">See the CHANGELOG