Does the Master Style Sheet cover all the bases when it comes to a CSS framework/reset?
I’ve been jumping from one site to another and have become confused with the updates/evolution of these frameworks/resets and really could use a little direction on all of this…
A primer on the most recent/best style sheet on this subject would be greatly appreciated. I use html5. Thanks so much!
Hi ScotchTape88. What master style sheet do you mean? The best way to get confused about CSS is to use a framework. 
This is what I found, which led me down into this rabbit hole…
Any advice on it or this topic in general would be great thanks!
/***** Global Settings *****/
Html, body {
Border: 0;
Margin: 0;
Padding: 0;
}
Body {
Font: 100%/1.25 Arial, Helvetica, sans-serif;
}
/***** Headings *****/
h1, h2, h3, h4, h5, h6 {
Margin: 0;
Padding: 0;
Font-weight: normal;
}
h1 {
Padding: 30px 0 25px 0;
Letter-spacing:-1px;
Font-size: 2em;
}
h2 {
Padding: 20px 0;
Letter-spacing:-1px;
Font-size: 1.5em;
}
h3 {
Font-size: 1em;
Font-weight: bold;
}
/***** Common Formatting *****/
p, ul, ol {
Margin:0;
Padding:0 0 1.25em 0;
}
Ul, ol {
Padding: 0 0 1.25em 2.5em;
}
Blockquote {
Margin: 1.25em;
Padding: 1.25em 1.25em 0 1.25em;
}
Small {
Font-size: 0.85em;
}
Img {
Border: 0;
}
Sup {
Position: relative;
Bottom: 0.3em;
Vertical-align: baseline;
}
Sub {
Position: relative;
Bottom:-0.2em;
Vertical-align: baseline;
}
Acronym, abbr {
Cursor: help;
Letter-spacing: 1px;
Border-bottom: 1px dashed;
}
/***** Links *****/
a,
a: link,
a:visited,
a:hover {
Text-decoration: underline;
}
/***** Forms *****/
Form {
Margin: 0;
Padding: 0;
Display: inline;
}
Form input,
Form select,
Form text area {
Font: 1em Arial, Helvetica, sans-serif;
}
Form textarea {
Width: 100%;
Line-height: 1.25;
}
Form label {
Cursor: pointer;
}
/***** Tables *****/
Table {
Border: 0;
Margin: 0 0 1.25em 0;
Padding: 0;
}
Table TR td {
Padding: 2px;
}
/***** Wrapper *****/
#wrap {
Width: 960px;
Margin: 0 autos;
}
/***** Global Classes *****/
.clear {clear: both; }
.float-left {float: left ;}
.float-right {float: right; }
.text-left {text-align: left; }
.text-right {text-align: right; }
.text-center {text-align: center; }
.text-justify {text-align: justify; }
.bold {font-weight: bold; }
.italic {font-style: italic; }
.underline {border-bottom: 1px solid ;}
.highlight {background: #ffc ;}
.wrap {width: 960px; margin: 0 auto; }
.img-left {float: left; margin: 4px 10px 4px 0; }
.img-right {float: right; margin: 4px 0 4px 10px; }
.nopadding {padding: 0 ;}
.noindent {margin-left: 0; padding-left: 0; }
.nobullet {list-style: none; list-style-image: none; }
This looks like a CSS reset. I would think that frameworks would have their own reset. I just use a simpler reset usually, like so:
html, body, div, h1, h2, h3, h4, h5, h6, p, a, blockquote, pre, code, hr, img, form, fieldset, legend, label, textarea, span, em, strong, sub, sup, cite, table, tbody, td, tfoot, th, thead, tr, tt, dl, dt, dd, ol, ul, li {margin: 0; padding: 0;}
img {vertical-align: bottom; border: none;}