Code Monkey home page Code Monkey logo

sanitize.css's Introduction

sanitize.css sanitize.css logo

NPM Version Bower Version CDNJS Version Build Status License Gitter Chat

sanitize.css is a CSS library that corrects broken and missing styles in all browsers, preserving useful defaults rather than unstyling everything. It’s developed alongside normalize.css, so every normalization includes the browsers or browser versions being targeted, and every opinionated change is marked and documented.

NPM
npm install --save sanitize.css
Bower
bower install --save sanitize-css

Features

Box sizing should be inherited and default to border-box
* {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}
Backgrounds should not repeat by default
* {
	background-repeat: no-repeat;
}
Cursor should only change to hint non-obvious interfaces
html {
	cursor: default;
}
Documents should not use a margin for outer padding
body {
	margin: 0;
}
Navigation lists should not include a marker style
nav ol, nav ul {
	list-style: none;
}
Text selections should not include text shadows
::selection {
	text-shadow: none;
}
Media elements should align to the text center of other content
audio, canvas, iframe, img, svg, video {
	vertical-align: middle;
}
SVGs should fallback to their surrounding text color
svg {
	fill: currentColor;
}
Tables should not include additional border spacing
table {
	border-collapse: collapse;
}
Form controls should be easily style-able
button, input, select, textarea {
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}
Textarea should only resize vertically by default
textarea {
	resize: vertical;
}
Single taps should be dispatched immediately on clickable elements
a, area, button, input, label, select, summary, textarea, [tabindex] {
	-ms-touch-action: manipulation;
	touch-action: manipulation;
}
ARIA roles should include visual cursor hints
[aria-busy="true"] {
	cursor: progress;
}

[aria-controls] {
	cursor: pointer;
}

[aria-disabled] {
	cursor: default;
}
Visually hidden content should remain accessible
[aria-hidden="false"][hidden]:not(:focus) {
	clip: rect(0, 0, 0, 0);
	display: inherit;
	position: absolute;
}

Differences

normalize.css and sanitize.css correct browser bugs while carefully testing and documenting changes. normalize.css styles adhere to css specifications. sanitize.css styles adhere to common developer expectations and preferences. reset.css unstyles all elements. Both sanitize.css and normalize.css are maintained in sync.

Support

At present, sanitize.css supports the current and previous major releases of popular web browsers. When a new version is released, we begin supporting that newer version and stop supporting the third version back. Additionally, many older browsers remain supported without supplementary CSS.

Currently tested and supported browsers in the latest release include Android 4.3-4.4+, Chrome 50-51+, Edge 12-13+, Firefox 46-47+, Internet Explorer 10-11, iOS 7-8+, Opera 37-38+, Safari 8-9+, and Windows Phone 8.1+.

Additionally tested and supported browsers (requiring little supplementary CSS) include Internet Explorer 9 and Safari 7.

License

sanitize.css is dedicated to the public domain.

sanitize.css's People

Contributors

jonathantneal avatar ungoldman avatar sotayamashita avatar bcomnes avatar bjork24 avatar fabianbeiner avatar m-iskw avatar filipelinhares avatar zrothauser avatar metaloha avatar weotch avatar levithomason avatar charbelrami avatar brunorios1 avatar machida avatar dada0423 avatar ciju avatar chuck0523 avatar vovanbo avatar tzi avatar pascalduez avatar m-e-h avatar cloud-walker avatar kaelig avatar kittygiraudel avatar epilande avatar zspecza avatar crswll avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.