Hi guys!
This is my css for my latest site, and I'm still working alot on optimizing my code.. do you see
anything I've missed and can do better?
This is my css for my latest site, and I'm still working alot on optimizing my code.. do you see
anything I've missed and can do better?
| Code: |
| /*
Project: Björn Blomquist Style: General stylesheet Version: 0.1 Author: Björn Blomquist Updated: 2008-03-09 ============================================================ */ /* 01. Basic ============================================================ */ html { font-size: 60%; font-family: helvetica, arial, verdana, sans-serif; } body { background:#363636; padding:0; margin:0; } strong, th, thead td, h1, h2, h3, h4, h5, h6, dt { font-weight: bold; margin:0; padding:0; } cite, em, dfn { font-style: italic; } abbr, acronym { text-transform: uppercase; } a abbr, a acronym { border: none; } abbr[title], acronym[title], dfn[title] { cursor: help; border-bottom: 1px solid; } img { vertical-align:bottom; border:0; } img.small {vertical-align:bottom; border:0; height:50px; width:50px;} a:link, a:visited, a:hover, a:active, a:focus { text-decoration: none; cursor:pointer; } a:hover, a:active, a:focus { text-decoration: underline; } fieldset { border: 0px; } legend { background: #fff; } textarea, input[type='text'], select { border: 1px solid #ccc; background: #fff; } textarea:hover, input[type='text']:hover, input[type='password']:hover, select:hover { border-color: #d9d9d9; } textarea:focus, input[type='text']:focus, input[type='password']:focus, select:focus { border-color: #888; outline: 2px solid #ddd; } input[type='button'], input[type='submit'], input[type='checkbox'], input[type='image'], input[type='radio'], input[type='reset'], select, button { cursor: pointer; } input[type='hidden'] { display:none; } div#pagefooter:after, div.content-row:after, .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ /* Pagewrap ============================================================ */ div#pagewrap { width:920px; margin:15px auto; background:#fff; border-top:3px solid #2fb3b4; } /* Pagehead ============================================================ */ div#pagehead { width:900px; height:80px; background:#fff; position:relative; padding-left:20px; } div#pagehead h1 { font-size:1em; text-transform:uppercase; color:#bebebe; font-weight:normal; padding-top:21px; } div#pagehead h1 span { font-family:georgia, serif; font-size:2.2em; font-weight:bold; color:#262626; position:relative; top:4px; padding:2px 15px 2px 0; margin-right:12px; border-right:1px solid #bebebe; } div#pagehead ul#menu { position:absolute; top:23px; right:20px; margin:0; padding:0; list-style:none; } div#pagehead ul#menu li { float:left; padding:4px 8px; background:#fff; margin:0 0 0 1px; } div#pagehead ul#menu li a { color:#2fb3b4; border-bottom:0px solid #fff; padding:4px 8px; text-decoration:none; } div#pagehead ul#menu li a:hover { color:#fff; border-bottom:0px solid #fff; padding:4px 8px; text-decoration:none; background:#2fb3b4; } div#pagehead ul#menu li.active { float:left; padding:4px 8px; background:#2fb3b4; margin:0 0 0 1px; } div#pagehead ul#menu li.active a { color:#fff; border-bottom:0px solid #fff; padding:4px 8px; text-decoration:none; } /* Pagecontent ============================================================ */ div#pagecontent { width:900px; height:auto; background:#fff; padding:0 10px 20px 10px; } div.content-row { display:block; background:#fff; padding:5px 0; float:left; } div.content-col { width:280px; margin:0 10px; background:#fff; float:left; display:inline; } div.content-col h2 { color:#2fb3b4; font-size:1.8em; text-transform:uppercase; padding:0 0 5px 0; } div.content-col h3 { color:#545454; font-size:1.4em; line-height:1.4em; font-family:georgia, serif; font-weight:normal; text-align:justify; margin:5px 0 20px 0; } div.content-col p { margin:5px 0; font-size:1.2em; line-height:1.4em; text-align:justify; } div.content-col strong { color:#545454; } div.content-col img { margin:5px 0; } div.content-col a { color:#2fb3b4; } div.content-col a.pdf { color:#2fb3b4; background: transparent url('../images/adobepdf.jpg') top left no-repeat; padding:5px 0 5px 30px;} div.content-colwide { width:570px; margin:0 10px; background:#fff; float:left; } div.content-colwide p { margin:5px 0; font-size:1.2em; line-height:1.4em; text-align:justify; } div.content-colwide a { color:#2fb3b4; } div.content-colwide a.pdf { color:#2fb3b4; background: transparent url('../images/adobepdf.jpg') top left no-repeat; padding:5px 0 5px 30px;} /* Pagefooter ============================================================ */ div#pagefooter { width:900px; height:auto; background:#2fb3b4 url(../images/bg-footer.jpg) top left repeat-x; padding:3px 10px; } div#pagefooter p { font-size:1em; color:#fff; padding:3px 10px; border-left:1px solid #7ecacb; float:left; } div#pagefooter p.copyright { border:0; } |
