All About CSS

everything you wanted to know about style sheets but were afraid to ask

.basic

.basic
background-color: #FFFFFF;
text-align: left;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
line-height: 15px;
color: #666666;

.notasbasic

.notasbasic
font-family: Geneva, Arial, Helvetica, san-serif;
font-size: 11px;
background-color: #FFCCCC;
text-align: left;
color: #666666;
width: 250px;
margin-top: 20px;
margin-right: 0px;
margin-bottom: 10px;
margin-left: 0px;
line-height: 15px;
padding-top: 0px;
text-indent: 5px;

.evenlessbasic

.evenlessbasic
font-family: Geneva, Arial, Helvetica, san-serif;
font-size: 11px;
background-color: #FFCCCC;
text-align: left;
color: #666666;
width: 250px;
margin-top: 20px;
margin-right: 0px;
margin-bottom: 20px;
margin-left: 50px;
line-height: 15px;
padding: 20;

.funwithmargins

.funwithmargins {
font-family: Geneva, Arial, Helvetica, san-serif;
font-size: 11px;
text-align: left;
color: #666666;
width: 250px;
margin-top: 10px;
margin-right: 0px;
margin-bottom: -100px;
margin-left: 100px;
line-height: 15px;
padding: 20;
background-color: #FFCCCC;

.moremargins {
font-family: "Times New Roman", Times, serif;
font-size: 12px;
text-align: left;
color: #000000;
width: 250px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 10px;
margin-left: 100px;
line-height: 15px;
padding: 20;
border-top-color: #009900;
border-right-color: #009900;
border-bottom-color: #009900;
border-left-color: #009900;
border-top-style: solid;
border-top-width: 1px;
border-right-style: solid;
border-right-width: 1px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-left-style: solid;
border-left-width: 1px;

.wordspacing and letterspacing

.wordspacing {
font-family: Geneva, Arial, Helvetica, san-serif;
font-size: 11px;
background-color: #FFCCCC;
text-align: left;
color: #666666;
width: 250px;
margin-top: 20px;
margin-right: 0px;
margin-bottom: 20px;
margin-left: 50px;
line-height: 15px;
padding: 20;
word-spacing: 10px;
}

.letterspacing {
font-family: Geneva, Arial, Helvetica, san-serif;
font-size: 11px;
background-color: #FFCCCC;
text-align: left;
color: #666666;
width: 250px;
margin-top: 20px;
margin-right: 0px;
margin-bottom: 20px;
margin-left: 50px;
line-height: 15px;
padding: 20;
letter-spacing: 5px;

.imagebasic (fixed)

.imagebasic {
font-family: Geneva, Arial, Helvetica, san-serif;
font-size: 11px;
text-align: left;
color: #000000;
line-height: 15px;
background-image: url("images/cloud.gif");
background-attachment: fixed;
background-repeat: no-repeat;
border-top: 1;
border-right: 1;
border-bottom: 1;
border-left: 1;
border-color: #333333;
border-style: solid;
border-width: 1;
width: 400px;
padding: 10;
height: 400px;
background-position: 10px 10px;

.imagebasic (scroll)

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin accumsan arcu quis augue. Nam aliquet gravida metus. Integer enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Maecenas tellus nulla, placerat eget, dapibus et, interdum ut, lectus. Proin dui neque, ullamcorper eget, mattis ullamcorper, semper sit amet, velit. Nam nisl nunc, convallis nec, volutpat quis, molestie eget, tellus. Quisque quis sapien eu ipsum sagittis pellentesque. Vestibulum varius velit id diam.
Praesent leo mauris, dapibus pretium, hendrerit ut, volutpat eu, nunc. Aenean ut metus mollis velit suscipit sagittis. Maecenas metus quam, facilisis eget, adipiscing non, ullamcorper non, nisi. Phasellus malesuada laoreet dui. Fusce quis dui vitae lorem dapibus vulputate. Sed ullamcorper posuere risus. Mauris tortor eros, sagittis a, auctor in, accumsan congue, pede. Etiam elit ipsum, aliquet vel, elementum sed, euismod eu Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin accumsan arcu quis augue. Nam aliquet gravida metus. Integer enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Maecenas tellus nulla, placerat eget, dapibus et, interdum ut, lectus. Proin dui neque, ullamcorper eget, mattis ullamcorper, semper sit amet, velit. Nam nisl nunc, convallis nec, volutpat quis, molestie eget, tellus. Quisque quis sapien eu ipsum sagittis pellentesque. Vestibulum varius velit id diam.
Praesent leo mauris, dapibus pretium, hendrerit ut, volutpat eu, nunc. Aenean ut metus mollis velit suscipit sagittis. Maecenas metus quam, facilisis eget, adipiscing non, ullamcorper non, nisi. Phasellus malesuada laoreet dui. Fusce quis dui vitae lorem dapibus vulputate. Sed ullamcorper posuere risus. Mauris tortor eros, sagittis a, auctor in, accumsan congue, pede. Etiam elit ipsum, aliquet vel, elementum sed, euismod eLorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin accumsan arcu quis augue. Nam aliquet gravida metus. Integer enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Maecenas tellus nulla, placerat eget, dapibus et, interdum ut, lectus. Proin dui neque, ullamcorper eget, mattis ullamcorper, semper sit amet, velit. Nam nisl nunc, convallis nec, volutpat quis, molestie eget, tellus. Quisque quis sapien eu ipsum sagittis pellentesque. Vestibulum varius velit id diam.
Praesent leo mauris, dapibus pretium, hendrerit ut, volutpat eu, nunc. Aenean ut metus mollis velit suscipit sagittis. Maecenas metus quam, facilisis eget, adipiscing non, ullamcorper non, nisi. Phasellus malesuada laoreet dui. Fusce quis dui vitae lorem dapibus vulputate. Sed ullamcorper posuere risus. Mauris tortor eros, sagittis a, auctor in, accumsan congue, pede. Etiam elit ipsum, aliquet vel, elementum sed, euismod eu Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin accumsan arcu quis augue. Nam aliquet gravida metus. Integer enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Maecenas tellus nulla, placerat eget, dapibus et, interdum ut, lectus. Proin dui neque, ullamcorper eget, mattis ullamcorper, semper sit amet, velit. Nam nisl nunc, convallis nec, volutpat quis, molestie eget, tellus. Quisque quis sapien eu ipsum sagittis pellentesque. Vestibulum varius velit id diam.
Praesent leo mauris, dapibus pretium, hendrerit ut, volutpat eu, nunc. Aenean ut metus mollis velit suscipit sagittis. Maecenas metus quam, facilisis eget, adipiscing non, ullamcorper non, nisi. Phasellus malesuada laoreet dui. Fusce quis dui vitae lorem dapibus vulputate. Sed ullamcorper posuere risus. Mauris tortor eros, sagittis a, auctor in, accumsan congue, pede. Etiam elit ipsum, aliquet vel, elementum sed, euismod e

.imagescroll {
font-family: Geneva, Arial, Helvetica, san-serif;
font-size: 11px;
text-align: left;
color: #000000;
line-height: 15px;
background-image: url("images/cloud.gif");
background-attachment: scroll;
background-repeat: repeat-y;
border-top: 1;
border-right: 1;
border-bottom: 1;
border-left: 1;
border-color: #333333;
border-style: solid;
border-width: 1;
width: 400px;
padding: 10;
height: 800px;

.float (property is applied to the IMAGE)

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin accumsan arcu quis augue. Nam aliquet gravida metus. Integer enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Maecenas tellus nulla, placerat eget, dapibus et, interdum ut, lectus. Proin dui neque, ullamcorper eget, mattis ullamcorper, semper sit amet, velit. Nam nisl nunc, convallis nec, volutpat quis, molestie eget, tellus. Quisque quis sapien eu ipsum sagittis pellentesque. Vestibulum varius velit id diam.
Praesent leo mauris, dapibus pretium, hendrerit ut, volutpat eu, nunc. Aenean ut metus mollis velit suscipit sagittis. Maecenas metus quam, facilisis eget, adipiscing non, ullamcorper non, nisi. Phasellus malesuada laoreet dui. Fusce quis dui vitae lorem dapibus vulputate. Sed ullamcorper posuere risus. Mauris tortor eros, sagittis a, auctor in, accumsan congue, pede. Etiam elit ipsum, aliquet vel, elementum sed, euismod eu Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin accumsan arcu quis augue. Nam aliquet gravida metus. Integer enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Maecenas tellus nulla, placerat eget, dapibus et, interdum ut, lectus. Proin dui neque, ullamcorper eget, mattis ullamcorper, semper sit amet, velit. Nam nisl nunc, convallis nec, volutpat quis, molestie eget, tellus. Quisque quis sapien eu ipsum sagittis pellentesque. Vestibulum varius velit id diam.
Praesent leo mauris, dapibus pretium, hendrerit ut, volutpat eu, nunc. Aenean ut metus mollis velit suscipit sagittis. Maecenas metus quam, facilisis eget, adipiscing non, ullamcorper non, nisi. Phasellus malesuada laoreet dui. Fusce quis dui vitae lorem dapibus vulputate. Sed ullamcorper posuere risus. Mauris tortor eros, sagittis a, auctor in, accumsan congue, pede. Etiam elit ipsum, aliquet vel, elementum sed, euismod eu Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin accumsan arcu quis augue. Nam aliquet gravida metus. Integer enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Maecenas tellus nulla, placerat eget, dapibus et, interdum ut, lectus. Proin dui neque, ullamcorper eget, mattis ullamcorper, semper sit amet, velit. Nam nisl nunc, convallis nec, volutpat quis, molestie eget, tellus. Quisque quis sapien eu ipsum sagittis pellentesque. Vestibulum varius velit id diam.
Praesent leo mauris, dapibus pretium, hendrerit ut, volutpat eu, nunc. Aenean ut metus mollis velit suscipit sagittis. Maecenas metus quam, facilisis eget, adipiscing non, ullamcorper non, nisi. Phasellus malesuada laoreet dui. Fusce quis dui vitae lorem dapibus vulputate. Sed ullamcorper posuere risus. Mauris tortor eros, sagittis a, auctor in, accumsan congue, pede. Etiam elit ipsum, aliquet vel, elementum sed, euismod eu

.float {
text-align: left;
border-top: 1;
border-right: 1;
border-bottom: 1;
border-left: 1;
border-color: #333333;
border-style: solid;
border-width: 1;
padding: 0;
float: left;
margin: 8;
vertical-align: middle;

.verticalalign

middle alignment

top alignment

text bottom j y g

text align baseline

.creating custom link states

Be informed about something.

.appyling styles to tables