Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@robwierzbowski
Last active November 2, 2017 03:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save robwierzbowski/f309d548d67e0058e9fc243a58984be2 to your computer and use it in GitHub Desktop.
Save robwierzbowski/f309d548d67e0058e9fc243a58984be2 to your computer and use it in GitHub Desktop.
Reset stylesheet example. Uses PostCSS nesting.
/*
Reset text elements for easy semantic use.
http://anthonyshort.me/global-typographic-styles-suck/
*/
/* Pseudo */
:focus {
outline: none;
}
/* Lists */
ul,
ol,
dl,
li,
dt,
dd {
margin: 0;
padding: 0;
}
li {
display: block;
list-style: none;
}
/* Tables */
table {
border-spacing: 0;
border-collapse: collapse;
}
th {
font-weight: inherit;
}
/* Forms */
form {
margin: 0;
}
fieldset {
margin: 0;
padding: 0;
border: 0;
}
button,
input,
select,
textarea {
margin: 0;
padding: 0;
color: inherit;
font-style: inherit;
font-weight: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
background-color: transparent;
}
input[type="search"] {
-webkit-appearance: textfield;
}
&::-webkit-search-decoration {
-webkit-appearance: none;
}
}
/* Images */
figure {
margin: 0;
}
/* Block level text */
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
font-weight: inherit;
font-size: inherit;
line-height: inherit;
}
p,
blockquote {
margin: 0;
}
pre {
margin: 0;
font-size: inherit;
font-family: inherit;
}
/* Links */
a {
color: inherit;
font-weight: inherit;
text-decoration: none;
&:hover,
&:active,
&:focus,
&:visited {
outline: none;
text-decoration: none;
}
img {
border: none;
}
}
/* Other inline text */
cite {
font-style: normal;
}
ins {
text-decoration: none;
}
dfn {
font-style: inherit;
}
del {
text-decoration: none;
}
mark {
color: inherit;
background: none;
}
address {
font-style: normal;
}
tt,
code,
kbd,
samp {
font-size: inherit;
font-family: inherit;
}
b,
strong {
font-weight: inherit;
}
i,
em {
font-style: inherit;
}
small {
font-size: 100%;
}
q {
quotes: none;
&:before,
&:after {
content: "";
content: none;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment