Skip to content
Snippets Groups Projects
Commit b0b91a9e authored by Angie Byron's avatar Angie Byron
Browse files

Issue #2217523 by nod_, droplet, joelpittet, sun: Update normalize.css to v3.0.1.

parent d53d8cf7
No related branches found
No related tags found
No related merge requests found
== HEAD
=== HEAD
== 2.1.2 (May 11, 2013)
=== 3.0.1 (March 27, 2014)
* Add package.json for npm support.
=== 3.0.0 (January 28, 2014)
=== 3.0.0-rc.1 (January 26, 2014)
* Explicit tests for each normalization.
* Fix i18n for `q` element.
* Fix `pre` text formatting and overflow.
* Fix vertical alignment of `progress`.
* Address `button` overflow in IE 8/9/10.
* Revert `textarea` alignment modification.
* Fix number input button cursor in Chrome on OS X.
* Remove `a:focus` outline normalization.
* Fix `figure` margin normalization.
* Normalize `optgroup`.
* Remove default table cell padding.
* Set correct display for `progress` in IE 8/9.
* Fix `font` and `color` inheritance for forms.
=== 2.1.3 (August 26, 2013)
* Fix component.json.
* Remove the gray background color from active links in IE 10.
=== 2.1.2 (May 11, 2013)
* Revert root `color` and `background` normalizations.
== 2.1.1 (April 8, 2013)
=== 2.1.1 (April 8, 2013)
* Normalize root `color` and `background` to counter the effects of system
color schemes.
== 2.1.0 (January 21, 2013)
=== 2.1.0 (January 21, 2013)
* Normalize `text-transform` for `button` and `select`.
* Normalize `h1` margin when within HTML5 sectioning elements.
......@@ -18,11 +45,11 @@
* Add `main` element to HTML5 display definitions.
* Fix cursor style for disabled button `input`.
== 2.0.1 (August 20, 2012)
=== 2.0.1 (August 20, 2012)
* Remove stray IE 6/7 `inline-block` hack from HTML5 display settings.
== 2.0.0 (August 19, 2012)
=== 2.0.0 (August 19, 2012)
* Remove legacy browser form normalizations.
* Remove all list normalizations.
......@@ -31,11 +58,11 @@
* Form elements automatically inherit `font-family` from ancestor.
* Drop support for IE 6/7, Firefox < 4, and Safari < 5.
== 1.0.1 (August 19, 2012)
=== 1.0.1 (August 19, 2012)
* Adjust `small` font size normalization.
== 1.0.0 (August 14, 2012)
=== 1.0.0 (August 14, 2012)
(Only the notable changes since public release)
......
......@@ -172,6 +172,6 @@ cutting new releases.
added to the CHANGELOG (inc. date), and the `bower.json`, `component.json`,
and `normalize.css` files.
3. The commit message must be of `v0.0.0` format.
4. Create an annotated tag for the version: `git tag -m "v0.0.0" v0.0.0`.
4. Create an annotated tag for the version: `git tag -m "v0.0.0" 0.0.0`.
5. Push the changes and tags to GitHub: `git push --tags origin master`
6. Checkout the `gh-pages` branch and follow the instructions in the README.
# normalize.css v2
# normalize.css v3
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.
elements more consistently and in line with modern standards.
[Check out the demo](http://necolas.github.io/normalize.css/latest/test.html)
The project relies on researching the differences between default browser
styles in order to precisely target only the styles that need or benefit from
normalizing.
[Legacy browser support is available in v1](https://github.com/necolas/normalize.css/tree/v1)
[View the test file](http://necolas.github.io/normalize.css/latest/test.html)
## Install
Download from the [project page](http://necolas.github.io/normalize.css/).
Install with [Bower](http://bower.io/): `bower install --save normalize-css`
Install with [Component(1)](https://github.com/component/component/): `component install necolas/normalize.css`
Install with [npm](http://npmjs.org/): `npm install --save normalize.css`
Install with [Bower](http://bower.io/): `bower install --save normalize.css`
## What does it do?
......@@ -25,21 +29,25 @@ Install with [Bower](http://bower.io/): `bower install --save normalize-css`
## How to use it
Normalize.css is intended to be used as an alternative to CSS resets.
No other styles should come before Normalize.css.
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.
It is recommended that you include the `normalize.css` file as untouched
library code.
## Browser support
* Google Chrome
* Mozilla Firefox 4+
* Apple Safari 5+
* Opera 12+
* Google Chrome (latest)
* Mozilla Firefox (latest)
* Mozilla Firefox 4
* Opera (latest)
* Apple Safari 6+
* Internet Explorer 8+
## Contribute
[Normalize.css v1 provides legacy browser
support](https://github.com/necolas/normalize.css/tree/v1) (IE 6+, Safari 4+),
but is no longer actively developed.
## Contributing
Please read the CONTRIBUTING.md
......
{
"name": "normalize-css",
"version": "3.0.1",
"main": "normalize.css",
"author": "Nicolas Gallagher",
"ignore": [
"CHANGELOG.md",
"CONTRIBUTING.md",
"component.json",
"package.json",
"test.html"
]
}
{
"name": "normalize-css",
"version": "2.1.2",
"styles": ["normalize.css"],
"author": "Nicolas Gallagher"
"name": "normalize.css",
"repo": "necolas/normalize.css",
"version": "3.0.1",
"styles": ["normalize.css"],
"author": "Nicolas Gallagher",
"license": "MIT"
}
/*! normalize.css v2.1.2 | MIT License | git.io/normalize */
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/* ==========================================================================
HTML5 display definitions
/**
* 1. Set default font family to sans-serif.
* 2. Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/
html {
font-family: sans-serif; /* 1 */
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/**
* Remove default margin.
*/
body {
margin: 0;
}
/* HTML5 display definitions
========================================================================== */
/**
* Correct `block` display not defined in IE 8/9.
* Correct `block` display not defined for any HTML5 element in IE 8/9.
* Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
* Correct `block` display not defined for `main` in IE 11.
*/
article,
......@@ -20,17 +41,20 @@ main,
nav,
section,
summary {
display: block;
display: block;
}
/**
* Correct `inline-block` display not defined in IE 8/9.
* 1. Correct `inline-block` display not defined in IE 8/9.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/
audio,
canvas,
progress,
video {
display: inline-block;
display: inline-block; /* 1 */
vertical-align: baseline; /* 2 */
}
/**
......@@ -39,52 +63,29 @@ video {
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Address styling not present in IE 8/9.
*/
[hidden] {
display: none;
}
/* ==========================================================================
Base
========================================================================== */
/**
* 1. Set default font family to sans-serif.
* 2. Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/
html {
font-family: sans-serif; /* 1 */
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
display: none;
height: 0;
}
/**
* Remove default margin.
* Address `[hidden]` styling not present in IE 8/9/10.
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
*/
body {
margin: 0;
[hidden],
template {
display: none;
}
/* ==========================================================================
Links
/* Links
========================================================================== */
/**
* Address `outline` inconsistency between Chrome and other browsers.
* Remove the gray background color from active links in IE 10.
*/
a:focus {
outline: thin dotted;
a {
background: transparent;
}
/**
......@@ -93,56 +94,45 @@ a:focus {
a:active,
a:hover {
outline: 0;
outline: 0;
}
/* ==========================================================================
Typography
/* Text-level semantics
========================================================================== */
/**
* Address variable `h1` font-size and margin within `section` and `article`
* contexts in Firefox 4+, Safari 5, and Chrome.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/**
* Address styling not present in IE 8/9, Safari 5, and Chrome.
* Address styling not present in IE 8/9/10/11, Safari, and Chrome.
*/
abbr[title] {
border-bottom: 1px dotted;
border-bottom: 1px dotted;
}
/**
* Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
*/
b,
strong {
font-weight: bold;
font-weight: bold;
}
/**
* Address styling not present in Safari 5 and Chrome.
* Address styling not present in Safari and Chrome.
*/
dfn {
font-style: italic;
font-style: italic;
}
/**
* Address differences between Firefox and other browsers.
* Address variable `h1` font-size and margin within `section` and `article`
* contexts in Firefox 4+, Safari, and Chrome.
*/
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/**
......@@ -150,36 +140,8 @@ hr {
*/
mark {
background: #ff0;
color: #000;
}
/**
* Correct font family set oddly in Safari 5 and Chrome.
*/
code,
kbd,
pre,
samp {
font-family: monospace, serif;
font-size: 1em;
}
/**
* Improve readability of pre-formatted text in all browsers.
*/
pre {
white-space: pre-wrap;
}
/**
* Set consistent quote types.
*/
q {
quotes: "\201C" "\201D" "\2018" "\2019";
background: #ff0;
color: #000;
}
/**
......@@ -187,7 +149,7 @@ q {
*/
small {
font-size: 80%;
font-size: 80%;
}
/**
......@@ -196,111 +158,123 @@ small {
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
top: -0.5em;
}
sub {
bottom: -0.25em;
bottom: -0.25em;
}
/* ==========================================================================
Embedded content
/* Embedded content
========================================================================== */
/**
* Remove border when inside `a` element in IE 8/9.
* Remove border when inside `a` element in IE 8/9/10.
*/
img {
border: 0;
border: 0;
}
/**
* Correct overflow displayed oddly in IE 9.
* Correct overflow not hidden in IE 9/10/11.
*/
svg:not(:root) {
overflow: hidden;
overflow: hidden;
}
/* ==========================================================================
Figures
/* Grouping content
========================================================================== */
/**
* Address margin not present in IE 8/9 and Safari 5.
* Address margin not present in IE 8/9 and Safari.
*/
figure {
margin: 0;
margin: 1em 40px;
}
/* ==========================================================================
Forms
========================================================================== */
/**
* Address differences between Firefox and other browsers.
*/
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
/**
* Define consistent border, margin, and padding.
* Contain overflow in all browsers.
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
pre {
overflow: auto;
}
/**
* 1. Correct `color` not being inherited in IE 8/9.
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
* Address odd `em`-unit font size rendering in all browsers.
*/
legend {
border: 0; /* 1 */
padding: 0; /* 2 */
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
/* Forms
========================================================================== */
/**
* Known limitation: by default, Chrome and Safari on OS X allow very limited
* styling of `select`, unless a `border` property is set.
*/
/**
* 1. Correct font family not being inherited in all browsers.
* 2. Correct font size not being inherited in all browsers.
* 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
* 1. Correct color not being inherited.
* Known issue: affects color of disabled elements.
* 2. Correct font properties not being inherited.
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 2 */
margin: 0; /* 3 */
color: inherit; /* 1 */
font: inherit; /* 2 */
margin: 0; /* 3 */
}
/**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.
* Address `overflow` set to `hidden` in IE 8/9/10/11.
*/
button,
input {
line-height: normal;
button {
overflow: visible;
}
/**
* 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 8+.
* Correct `select` style inheritance in Firefox 4+ and Opera.
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
* Correct `select` style inheritance in Firefox.
*/
button,
select {
text-transform: none;
text-transform: none;
}
/**
......@@ -315,8 +289,8 @@ button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
}
/**
......@@ -325,65 +299,115 @@ input[type="submit"] {
button[disabled],
html input[disabled] {
cursor: default;
cursor: default;
}
/**
* 1. Address box sizing set to `content-box` in IE 8/9.
* 2. Remove excess padding in IE 8/9.
* Remove inner padding and border in Firefox 4+.
*/
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.
*/
input {
line-height: normal;
}
/**
* It's recommended that you don't attempt to style these elements.
* Firefox's implementation doesn't respect box-sizing, padding, or width.
*
* 1. Address box sizing set to `content-box` in IE 8/9/10.
* 2. Remove excess padding in IE 8/9/10.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
* `font-size` values of the `input`, it causes the cursor style of the
* decrement button to change from `default` to `text`.
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Address `appearance` set to `searchfield` in Safari and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari 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;
-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.
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
* Safari (but not Chrome) clips the cancel button when the search input has
* padding (and `textfield` appearance).
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
-webkit-appearance: none;
}
/**
* Remove inner padding and border in Firefox 4+.
* Define consistent border, margin, and padding.
*/
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct `color` not being inherited in IE 8/9/10/11.
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
*/
legend {
border: 0; /* 1 */
padding: 0; /* 2 */
}
/**
* 1. Remove default vertical scrollbar in IE 8/9.
* 2. Improve readability and alignment in all browsers.
* Remove default vertical scrollbar in IE 8/9/10/11.
*/
textarea {
overflow: auto; /* 1 */
vertical-align: top; /* 2 */
overflow: auto;
}
/**
* Don't inherit the `font-weight` (applied by a rule above).
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
*/
optgroup {
font-weight: bold;
}
/* ==========================================================================
Tables
/* Tables
========================================================================== */
/**
......@@ -391,6 +415,11 @@ textarea {
*/
table {
border-collapse: collapse;
border-spacing: 0;
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
{
"name": "normalize.css",
"version": "3.0.1",
"description": "Normalize.css as a node packaged module",
"style": "normalize.css",
"files": [
"normalize.css",
"component.json"
],
"homepage": "http://necolas.github.io/normalize.css",
"repository": {
"type": "git",
"url": "git://github.com/necolas/normalize.css.git"
},
"author": "Nicolas Gallagher",
"license": "MIT"
}
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Normalize CSS: UI tests</title>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<link rel="stylesheet" href="normalize.css">
<style>
/*! suit-test v0.1.0 | MIT License | github.com/suitcss */
.Test {
background: #fff;
counter-reset: test-describe;
}
.Test-describe:before {
content: counter(test-describe);
counter-increment: test-describe;
}
.Test-describe {
counter-reset: test-it;
}
.Test-it:before {
content: counter(test-describe) "." counter(test-it);
counter-increment: test-it;
}
.Test-title {
font-size: 2em;
font-family: sans-serif;
padding: 20px;
margin: 20px 0;
background: #eee;
color: #999;
}
.Test-describe,
.Test-it {
background: #eee;
border-left: 5px solid #666;
color: #666;
font-family: sans-serif;
font-weight: bold;
margin: 20px 0;
padding: 0.75em 20px;
}
.Test-describe {
font-size: 1.5em;
margin: 60px 0 20px;
}
.Test-describe:before,
.Test-it:before {
color: #999;
display: inline-block;
margin-right: 10px;
min-width: 30px;
text-transform: uppercase;
}
/* Custom helpers */
/**
* Test whether the body's margin has been removed
*/
body {
background: red;
}
/**
* Highlight the bounds of direct children of a test block
*/
.Test-run--highlightEl > * {
outline: 1px solid #ADD8E6;
}
</style>
<div class="Test">
.
<h1 class="Test-title"><a href="https://github.com/necolas/normalize.css">Normalize.css</a>: UI tests</h1>
<h2 class="Test-describe"><code>html</code></h2>
<h3 class="Test-it">should have sans-serif font family (opinionated)</h3>
<div class="Test-run">
abcdefghijklmnopqrstuvwxyz
</div>
<h2 class="Test-describe"><code>body</code></h2>
<h3 class="Test-it">should have no margin (opinionated)</h3>
<div class="Test-run">
(there should be no red background visible on this page)
</div>
<h2 class="Test-describe"><code>article</code>, <code>aside</code>, <code>details</code>, <code>figure</code>, <code>figcaption</code>, <code>footer</code>, <code>header</code>, <code>hgroup</code>, <code>main</code>, <code>nav</code>, <code>section</code>, <code>summary</code></h2>
<h3 class="Test-it">should render as block</h3>
<div class="Test-run Test-run--highlightEl">
<article>article</article>
<aside>aside</aside>
<details>
<summary>summary</summary>
details
</details>
<figure>
figure
<figcaption>figcaption</figcaption>
</figure>
<footer>footer</footer>
<header>header</header>
<hgroup>hgroup</hgroup>
<main>main</main>
<nav>nav</nav>
<section>section</section>
</div>
<h2 class="Test-describe"><code>audio</code>, <code>canvas</code>, <code>progress</code>, <code>video</code></h2>
<h3 class="Test-it">should render as inline-block and baseline-aligned</h3>
<div class="Test-run Test-run--highlightEl">
<audio controls>audio</audio>
<canvas>canvas</canvas>
<progress>progress</progress>
<video controls>video</video>
</div>
<h2 class="Test-describe"><code>audio:not([controls])</code>, <code>template</code>, <code>[hidden]</code></h2>
<h3 class="Test-it">should not display</h3>
<div class="Test-run Test-run--highlightEl">
<audio>audio</audio>
<template>
<h1>{{title}}</h1>
<content></content>
</template>
<p hidden>This should be hidden</p>
</div>
<h2 class="Test-describe"><code>a</code></h2>
<h3 class="Test-it">should have a transparent background when active</h3>
<div class="Test-run">
<a href="#non">dummy anchor</a>
</div>
<h3 class="Test-it">should not have a focus outline when both focused and hovered (opinionated)</h3>
<div class="Test-run">
<a href="#non">dummy anchor</a>
</div>
<h2 class="Test-describe"><code>abbr[title]</code></h2>
<h3 class="Test-it">should have a dotted bottom border</h3>
<div class="Test-run">
<abbr title="abbreviation">abbr</abbr>
</div>
<h2 class="Test-describe"><code>b</code>, <code>strong</code></h2>
<h3 class="Test-it">should have bold font-weight</h3>
<div class="Test-run">
<b>b</b>
<strong>strong</strong>
</div>
<h2 class="Test-describe"><code>dfn</code></h2>
<h3 class="Test-it">should have italic font-style</h3>
<div class="Test-run">
<dfn>dfn</dfn>
</div>
<h2 class="Test-describe"><code>h1</code></h2>
<h3 class="Test-it">should not change size within an <code>article</code></h3>
<div class="Test-run">
<h1>Heading (control)</h1>
<article>
<h1>Heading (in article)</h1>
</article>
</div>
<h3 class="Test-it">should not change size within a <code>section</code></h3>
<div class="Test-run">
<h1>Heading (control)</h1>
<section>
<h1>Heading (in section)</h1>
</section>
</div>
<h2 class="Test-describe"><code>mark</code></h2>
<h3 class="Test-it">should have a yellow background</h3>
<div class="Test-run">
<mark>mark</mark>
</div>
<h2 class="Test-describe"><code>small</code></h2>
<h3 class="Test-it">should render equally small in all browsers</h3>
<div class="Test-run">
control. <small>small.</small>
</div>
<h2 class="Test-describe"><code>sub</code> and <code>sup</code></h2>
<h3 class="Test-it">should not affect a line's visual line-height</h3>
<div class="Test-run Test-run--highlightEl">
<p>control.</p>
<p>control. <sub>sub.</sub></p>
<p>control. <sup>sup.</sup></p>
</div>
<h2 class="Test-describe"><code>img</code></h2>
<h3 class="Test-it">should not have a border when wrapped in an anchor</h3>
<div class="Test-run">
<a href="#non">
<!-- scaled-up 1px image -->
<img style="background-color:#ADD8E6" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" width="100" height="100">
</a>
</div>
<h2 class="Test-describe"><code>svg</code></h2>
<h3 class="Test-it">should not overflow</h3>
<div class="Test-run Test-run--highlightEl">
<svg width="100px" height="100px">
<circle cx="100" cy="100" r="100" fill="#ADD8E6" />
</svg>
</div>
<h2 class="Test-describe"><code>figure</code></h2>
<h3 class="Test-it">should have margins</h3>
<div class="Test-run" style="outline:1px solid #ADD8E6; overflow:hidden;">
<figure>
<img style="background-color:#ADD8E6" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" width="400" height="200">
</figure>
</div>
<h2 class="Test-describe"><code>hr</code></h2>
<h3 class="Test-it">should have a <code>content-box</code> box model</h3>
<div class="Test-run" style="">
<hr style="height:2px; border:solid #ADD8E6; border-width:2px 0;">
</div>
<h2 class="Test-describe"><code>pre</code></h2>
<h3 class="Test-it">should trigger a scrollbar when too wide for its container</h3>
<div class="Test-run" style="max-width:300px; outline:1px solid #ADD8E6;">
<pre>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.</pre>
</div>
<h2 class="Test-describe"><code>code</code>, <code>kbd</code>, <code>pre</code>, <code>samp</code></h2>
<h3 class="Test-it">should render <code>em</code>-unit preformatted text at the same absolute size as normal text</h3>
<div class="Test-run">
<span>span: abcdefghijklmnopqrstuvwxyz.</span><br>
<code>code: abcdefghijklmnopqrstuvwxyz.</code><br>
<kbd>kbd: abcdefghijklmnopqrstuvwxyz.</kbd><br>
<samp>samp: abcdefghijklmnopqrstuvwxyz.</samp>
<pre>pre: abcdefghijklmnopqrstuvwxyz.</pre>
</div>
<h2 class="Test-describe"><code>button</code>, <code>input</code>, <code>optgroup</code>, <code>select</code>, <code>textarea</code></h2>
<h3 class="Test-it">should inherit <code>color</code> from ancestor</h3>
<div class="Test-run" style="color:#ADD8E6;">
<button>button</button><br>
<input value="input"><br>
<select style="border:1px solid #999;">
<optgroup label="optgroup">
<option>option</option>
</optgroup>
<option>option</option>
</select><br>
<textarea>textarea</textarea>
</div>
<h3 class="Test-it">should inherit <code>font</code> from ancestor</h3>
<div class="Test-run" style="font:bold italic 20px/1 serif;">
<button>button</button><br>
<input value="input"><br>
<select style="border:1px solid #999;">
<optgroup label="optgroup">
<option>option</option>
</optgroup>
<option>option</option>
</select><br>
<textarea>textarea</textarea>
</div>
<h3 class="Test-it">should not have margins</h3>
<div class="Test-run" id="form-collection-margins">
<style>
#form-collection-margins {
outline: 1px solid #ADD8E6;
overflow: hidden;
}
#form-collection-margins button,
#form-collection-margins input,
#form-collection-margins select,
#form-collection-margins textarea {
display: block;
}
</style>
<button>button</button>
<input value="input">
<select style="border:1px solid #999;">
<optgroup label="optgroup">
<option>option</option>
</optgroup>
<option>option</option>
</select>
<textarea>textarea</textarea>
</div>
<h2 class="Test-describe"><code>button</code></h2>
<h3 class="Test-it">should have visible overflow</h3>
<div class="Test-run" id="button-overflow">
<style>
#button-overflow button:after {
content: "";
background: #ADD8E6;
display: inline-block;
height: 10px;
position:relative;
right: -20px;
width: 10px;
}
</style>
<button>abcdefghijklmnopqrstuvwxyz</button>
</div>
<h2 class="Test-describe"><code>button</code>, <code>select</code></h2>
<h3 class="Test-it">should not inherit <code>text-transform</code></h3>
<div class="Test-run" style="text-transform:uppercase">
<button>button</button>
<select><option>option</option></select>
</div>
<h2 class="Test-describe"><code>button</code> and button-style <code>input</code></h2>
<h3 class="Test-it">should have <code>pointer</code> cursor style</h3>
<div class="Test-run">
<p><button>button</button></p>
<p><input type="image" src="http://lorempixel.com/90/24" alt="input (image)"></p>
<p><input type="button" value="input (button)"></p>
<p><input type="reset" value="input (reset)"></p>
<p><input type="submit" value="input (submit)"></p>
</div>
<h3 class="Test-it">should be styleable</h3>
<div class="Test-run" id="button-like-style">
<style>
#button-like-style button,
#button-like-style input {
background: #ADD8E6;
border: 2px solid black;
border-radius: 2px;
padding: 5px;
}
</style>
<p><button>button</button></p>
<p><input type="image" src="http://lorempixel.com/90/24" alt="input (image)"></p>
<p><input type="button" value="input (button)"></p>
<p><input type="reset" value="input (reset)"></p>
<p><input type="submit" value="input (submit)"></p>
</div>
<h2 class="Test-describe">disabled <code>button</code> and <code>input</code></h2>
<h3 class="Test-it">should have <code>default</code> cursor style</h3>
<div class="Test-run">
<p><button disabled>button</button></p>
<p><input disabled type="image" src="http://lorempixel.com/90/24" alt="input (image)"></p>
<p><input disabled type="button" value="input (button)"></p>
<p><input disabled type="reset" value="input (reset)"></p>
<p><input disabled type="submit" value="input (submit)"></p>
</div>
<h2 class="Test-describe"><code>button</code>, <code>input</code></h2>
<h3 class="Test-it">should not have extra inner padding in Firefox</h3>
<div class="Test-run" id="button-input-padding">
<style>
#button-input-padding button,
#button-input-padding input {
border: 0;
padding: 0;
outline: 1px solid #ADD8E6;
}
</style>
<p><button>button</button></p>
<p><input value="input (text)"></p>
<p><input type="button" value="input (button)"></p>
<p><input type="reset" value="input (reset)"></p>
<p><input type="submit" value="input (submit)"></p>
</div>
<h2 class="Test-describe"><code>input</code></h2>
<h3 class="Test-it">should not inherit <code>line-height</code></h3>
<div class="Test-run" style="line-height:50px">
<input value="input (text)">
</div>
<h2 class="Test-describe"><code>input[type="checkbox"]</code>, <code>input[type="radio"]</code></h2>
<h3 class="Test-it">should have a <code>border-box</code> box model</h3>
<div class="Test-run Test-run--highlightEl" id="radio-box-model">
<style>
#radio-box-model {
width: 200px;
border: 1px solid red;
}
#radio-box-model input {
width: 100%;
border: 5px solid #ADD8E6;
display: block;
position: relative;
}
</style>
<input type="checkbox">
<input type="radio" name="rad">
</div>
<h3 class="Test-it">should not have padding</h3>
<div class="Test-run Test-run--highlightEl">
<input type="checkbox">
<input type="radio" name="rad">
</div>
<h2 class="Test-describe"><code>input[type="number"]</code></h2>
<h3 class="Test-it">should display a default cursor for the decrement button's click target in Chrome</h3>
<div class="Test-run">
<input style="height:50px; font-size:15px;" type="number" id="in" min="0" max="10" value="5">
</div>
<h2 class="Test-describe"><code>input[type="search"]</code></h2>
<h3 class="Test-it">should be styleable</h3>
<div class="Test-run">
<input type="search" style="border:1px solid #ADD8E6; padding:10px; width:200px;">
</div>
<h3 class="Test-it">should have a <code>content-box</code> box model</h3>
<div class="Test-run">
<div style="background:red; display:inline-block; height:62px; width:242px;">
<input type="search" style="border:1px solid #ADD8E6; height:20px; padding:20px; width:200px;">
</div>
</div>
<h3 class="Test-it">should not have a cancel button in Safari or Chrome</h3>
<div class="Test-run">
<input type="search" value="search">
</div>
<h2 class="Test-describe"><code>fieldset</code></h2>
<h3 class="Test-it">should have consistent border, padding, and margin</h3>
<div class="Test-run">
<fieldset>
<div style="width:100%; height:100px; background:#ADD8E6;"></div>
</fieldset>
</div>
<h2 class="Test-describe"><code>legend</code></h2>
<h3 class="Test-it">should inherit color</h3>
<div class="Test-run" style="color:#ADD8E6;">
<fieldset>
<legend>legend</legend>
</fieldset>
</div>
<h3 class="Test-it">should not have padding</h3>
<div class="Test-run">
<fieldset>
<legend>legend</legend>
</fieldset>
</div>
<h2 class="Test-describe"><code>textarea</code></h2>
<h3 class="Test-it">should not have a scrollbar unless overflowing</h3>
<div class="Test-run">
<textarea>textarea</textarea>
</div>
<h2 class="Test-describe"><code>table</code></h2>
<h3 class="Test-it">should not have spaces between cells</h3>
<div class="Test-run">
<table>
<caption>Jimi Hendrix - albums</caption>
<thead>
<tr>
<th>Album</th>
<th>Year</th>
<th>Price</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Album</th>
<th>Year</th>
<th>Price</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Are You Experienced</td>
<td>1967</td>
<td>$10.00</td>
</tr>
<tr>
<td>Axis: Bold as Love</td>
<td>1967</td>
<td>$12.00</td>
</tr>
<tr>
<td>Electric Ladyland</td>
<td>1968</td>
<td>$10.00</td>
</tr>
<tr>
<td>Band of Gypsys</td>
<td>1970</td>
<td>$12.00</td>
</tr>
</tbody>
</table>
</div>
</div>
......@@ -679,7 +679,7 @@ modernizr:
normalize:
remote: https://github.com/necolas/normalize.css
version: v2.1.2
version: 3.0.1
css:
base:
assets/vendor/normalize-css/normalize.css: { every_page: true, weight: -20 }
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment