bellow is my css.. i had some complaints from people saying that the css had erros but i can't fined any... ul,ol{list-style:none;} h1,h2,h3,h4,h5,h6,pre,code,p{font-size:1em;} ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{margin:0;padding:0;} a img,:link img,:visited img{border:none;} address{font-style:normal;} body{font-size:62.5%;font-family:Georgia,"Times New Roman",Times,Serif;line-height:2.2em;color:#333;} a:link,a:visited{color:#772124;} a:hover{text-decoration:underline;color:#58181b;} #wrapper{width:930px;margin:0 auto;text-align:left;} #content{float:left;width:600px;padding:20px 30px 20px 0;} #sidebar{float:right;width:300px;padding-bottom:20px;} .thin-sidebar{float:left;width:140px;} .spad{padding-right:20px;} #footer{clear:both;padding-top:5px;border-top:1px solid #eee;} .clear:after,li.comment:after{content:".";display:block;height:0;clear:both;visibility:hidden;} #header{padding:20px 0 10px 0;border-bottom:5px solid #333;} h1#title,div#title{font-size:4.6em;font-weight:bold;line-height:1.3em;} h1#title a:link,h1#title a:visited,div#title a:link,div#title a:visited{color:#444;} h1#title a:hover,div#title a:hover{color:#772124;text-decoration:none;} #description{float:left;} #description h2{font-size:1.2em;font-weight:normal;color:#666;} #nav{float:right;font-size:1.5em;font-family:"Trebuchet MS","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;} #nav ul{padding:0 0 0 20px;position:relative;} #nav ul li{float:left;margin:0 0 0 15px;} #nav li a:link,#nav li a:visited{color:#333;text-decoration:none;} #nav li.current_page_item a,#nav li.current_page_parent a,#nav li.current_page_ancestor a,#nav li.current-cat a,#nav li a:hover{color:#772124;text-decoration:none;padding-top:.1em;border-top:4px solid #772124;} #menu{padding-bottom:10px;} #menu img{border:2px solid #eee;} .alert-box{margin:0 0 20px 0;padding:20px;background:#f3f3f2;border:1px solid #e3e1db;} .post-header{border-bottom:4px double #eee;padding-bottom:7px;} .post-header h1,.post-header h2{font-size:2.6em;line-height:1.1em;font-weight:normal;} .post-header h1 a:link,.post-header h1 a:visited,.post-header h2 a:link,.post-header h2 a:visited{color:#444;} .post-header h1 a:hover,.post-header h2 a:hover{color:#772124;} .comments{padding-top:10px;font-size:1.3em;color:#757575;text-transform:uppercase;} .comments a{display:block;color:#757575;padding:0 0 0 25px;background:url(../vigilance/images/comments-bubble.gif) no-repeat 0 4px;} .comments a:hover{color:#772124;background-position:0 -24px;} .post .date{float:right;padding-top:10px;color:#757575;font-size:1.6em;font-weight:normal;font-family:"Trebuchet MS","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;text-transform:uppercase;} .post .date span{color:#ddd;font-weight:bold;} #single-date{float:none;} .meta{margin:10px 0 20px 0;font-size:1.2em;color:#666;} .meta a:link,.meta a:visited{color:#666;font-style:normal;} .meta a:hover{color:#772124;} .tags{float:right;width:400px;text-align:right;font-style:italic;} .entru{font-size:1.3em;text-align:left;} .entru ol li,.c-body ol li{margin:10px 0 0 0;list-style-type:decimal;list-style-position:outside;} .entry a:link,.entry a:visited,.alert-box a:link,.alert-box a:visited{text-decoration:underline;} .entry a:hover,.alert-box a:hover{text-decoration:none;} .entry{font-size:1.3em;text-align:center;} .entry p{margin-bottom:10px;} .entry p.notice{padding:15px;background-color:#fffbcc;border:1px solid #f8f4c7;} .alert-box p{margin:10px 0 0 0;} .entry h2,.entry h3,.entry h4{font-size:1.3em;padding:15px 0 5px 0;} .entry h3{padding-top:10px;font-size:1em;} .entry h4{padding-top:10px;font-size:.9em;} .alert-box h2,.alert-box h3,.alert-box h4{margin:0;padding:0;} pre{margin:10px 0;padding:1em 10px;overflow:auto;background-color:#f3f3f3;color:#000;} code{padding:2px 3px;font:1.1em Consolas,Courier New,sans-serif;background-color:#f3f3f3;color:#000;} pre code{font-size:1.3em;} blockquote{clear:both;display:block;padding:20px 20px 10px 45px;margin:20px 0;font-style:italic;font-size:1.2em;color:#141310;background:#e7e6e2 url(../vigilance/images/blockquote.gif) no-repeat top left;} .entry ul,.c-body ul{margin:0 0 10px 10px;} .entry ul li,.c-body ul li{display:block;margin:5px 0 0 0;padding:0 0 0 17px;background:url(../vigilance/images/list-star.gif) no-repeat 0 .3em;} .entry ol,.c-body ol{margin:0 0 15px 30px;} .entry ol li ol li,.c-body ol li ol li{font-size:.9em;list-style-type:lower-roman;} .entry ol li,.c-body ol li{margin:10px 0 0 0;list-style-type:decimal;list-style-position:outside;} .navigation{padding:10px 0;font-size:1.3em;} .index{padding:0;} .float-quote{float:left;width:300px;padding:15px;margin:10px 10px 0 0;background:#eaeaea;border-top:4px solid #333;border-bottom:4px solid #333;} .entry .float-quote p{margin:0;padding:0 0 0 40px;font-size:1.2em;font-family:"Trebuchet MS","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;line-height:1.3em;background:url(../vigilance/images/float-quote.gif) no-repeat top left;} .highlight-box{float:right;margin:0 0 10px 10px;width:200px;padding:10px;font-family:"Trebuchet MS","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;border-top:8px solid #000;background:#772124;color:#fff;} .highlight-box a:link,.highlight-box a:visited{color:#fff;text-decoration:underline;} .highlight-box a:hover{text-decoration:none;} .entry .highlight-box p{margin:10px 0;line-height:1.4em;font-size:1.1em;} .entry .highlight-box ul li{font-size:1.1em;background:url(../vigilance/images/list-square.gif) no-repeat 0 .4em;} .entry .highlight-box h2,.entry .highlight-box h3,.entry .highlight-box h4{margin:0;padding:0;color:#fff;} .highlight-box h2{text-transform:uppercase;} .post-footer{padding-bottom:2px;margin:0 0 30px 0;font-size:1.1em;font-style:italic;text-align:right;color:#666;border-bottom:1px solid #eee;} .post-footer a:link,.post-footer a:visited{color:#333;font-style:normal;} .post-footer a:hover{color:#772124;} h1.pagetitle,h2.pagetitle{margin-bottom:20px;padding-bottom:7px;font-size:2.6em;line-height:1.1em;border-bottom:4px double #eee;} img.archive-comment{float:right;margin:0 .5em .5em 0;} .entries{font-size:1.3em;clear:both;} .entries ul{margin:0;padding:0 0 1px 0;background:transparent url(../vigilance/images/archives-dotted-line.gif) repeat-x bottom left;} .entries ul li{padding-top:1px;background:transparent url(../vigilance/images/archives-dotted-line.gif) repeat-x top left;} .entries ul li a{display:block;margin:0;padding:7px 0;} .entries ul li a:hover{background-color:#f8f8f7;text-decoration:none;} .entries span{display:block;text-align:right;} .entries span.archdate,.entries a:hover span.archdate{float:left;margin-right:3em;padding-left:.5em;width:3em;color:#666;} .entries span.comments_number{float:right;margin-right:.5em;width:3em;color:#666;} #sidebar-image{padding-top:20px;} #sidebar-image{font-size:1.3em;} #sidebar-image p{margin-bottom:15px;line-height:1.6em;} h2.widgettitle{padding:25px 0 3px 0;font-size:1.4em;font-weight:normal;text-transform:uppercase;letter-spacing:1.2pt;font-family:"Trebuchet MS","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;border-bottom:1px solid #eee;} ul li.widget ul{margin:0;font-size:1.4em;} ul li.widget ul li ul{margin-left:5px;font-size:1em;} ul li.widget ul li{padding:8px 0;border-bottom:1px solid #eee;} ul li.widget ul li ul li{border-bottom:none;} ul li.widget ul li a{display:block;padding:0 0 0 15px;background:url(../vigilance/images/list-item.gif) no-repeat 0 6px;} ul li.widget ul li a:hover{background-position:0 -136px;} ul li.widget ul#recentcomments li a{padding:0;background:none;} div.textwidget p{font-size:1.3em;margin:10px 0 0 0;} li.widget select{margin-top:10px;} #rss-feed{padding-top:10px;} #rss-feed p{font-size:1.3em;line-height:1.6em;} #rss-feed a.rss,#rss-feed a.email,#rss-feed a.twitter{float:left;font-size:1.3em;margin:10px 10px 0 0;display:block;padding:0 0 0 19px;background:url(../vigilance/images/feed-icon.png) no-repeat 0 .25em;} #rss-feed a.email{padding:0 0 0 25px;background:url(../vigilance/images/mail-icon.png) no-repeat 0 .4em;} #rss-feed a.twitter{margin-right:0;padding-left:19px;background:url(../vigilance/images/twitter-icon.png) no-repeat 0 .15em;} #search_form input{margin:10px 0 0 0;} #search_form input{padding:4px 2px;width:132px;border:2px solid #acacac;border-bottom:1px solid #ccc;border-right:1px solid #ccc;background:#f4f4f4;color:#888;} #search_form input:focus{background:#fff;} #search_form input#searchsubmit{padding:2px 10px;} .comment-number{display:block;font-size:1.3em;padding:0 0 10px 30px;background:url(../vigilance/images/comments-bubble-big.gif) no-repeat 0 .1em;} .comment-number span{font-size:1.3em;color:#777;} a#leavecomment{padding-left:10px;} li.comment{padding:20px 0 0 0;} ul.children{margin:10px 0 0 96px;clear:both;} div.c-grav{float:left;width:60px;margin:0;text-align:right;} div.c-grav img{border:4px solid #e3e3e3;-moz-border-radius:4px;-webkit-border-radius:4px;} div.c-body{float:right;width:474px;font-size:1.3em;background:#f3f3f3;padding:20px 20px 0 20px;-moz-border-radius:12px;-webkit-border-radius:12px;} ul.children div.c-body{width:378px;} div.c-body p{margin:10px 0 0 0;} div.c-head{font-weight:bold;} span.asterisk{float:right;color:#772124;font-size:2.2em;} div.c-date{color:#bbb;font-size:.9em;line-height:0;padding:10px 0 5px 0;font-family:"Trebuchet MS","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;font-weight:bold;} .c-permalink a:link,.c-permalink a:visited{margin-left:5px;color:#ccc;font-size:.7em;font-family:"Trebuchet MS","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;text-transform:uppercase;} div.reply,div.cancel-comment-reply{float:right;} div.reply{padding:10px 0;} div.reply a:link,div.reply a:visited{color:#aaa;font-size:.9em;font-family:"Trebuchet MS","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;text-transform:uppercase;border-bottom:1px dotted;} div.reply a:hover{border-bottom:1px solid;text-decoration:none;} form#commentform{margin-bottom:20px;} #respond{font-size:1.5em;} h4#postcomment{margin:20px 0;padding:0 0 5px 0;font-size:1.2em;color:#555;border-bottom:1px solid #eee;} form#commentform label.comment-field{display:block;margin:10px 0 5px 0;} input.text-input,form#commentform textarea{padding:7px;background:#f8f8f8;font-family:inherit;font-size:.9em;border:1px solid #e6e6e6;width:591px;} input#author,input#email,input#url{width:350px;} form#commentform input:focus,form#commentform textarea:focus{background:#fff;} form#commentform input#submit{padding:5px;width:150px;} form#commentform p.guidelines{margin:10px 0;font-size:.8em;color:#777;} p.subscribe-to-comments,p.comments-rss{margin:0 0 10px 0;font-size:.9em;} p.comments-rss a{padding:0 0 0 19px;background:url(../vigilance/images/feed-icon.png) no-repeat 0 .15em;} p.note{font-style:italic;font-size:1.3em;} h3.pinghead{font-size:1.3em;color:#444;} ol.pinglist{list-style-type:decimal;list-style-position:inside;margin:0 0 10px 10px;font-size:1.3em;} .entry img.alignleft,.entry img.alignright,.entry img.aligncenter{border:2px solid #eee;} .noborder{border:none;} .entry .alignright,.entry .alignright .float-quote{margin:0 0 10px 15px;} .entry .alignleft,.entry .alignleft .highlight-box{margin:0 15px 10px 0;} .wp-caption p{font-style:italic;color:#888;} #footer{color:#666;font-size:1.1em;} #footer p.right{float:right;} #footer a:link,#footer a:visited{color:#666;text-decoration:underline;} #footer a:hover{color:#772124;} .aligncenter{display:block;margin-left:auto;margin-right:auto;} .alignleft{float:left;} .alignright{float:right;} #content.no-sidebar{width:920px;} #content.no-sidebar li.comment{width:560px;} body.page-template-left-sidebar-php #sidebar{width:300px;float:left;padding:0;} body.page-template-left-sidebar-php #content{width:600px;float:right;padding:20px 0 20px 20px;} #wp_page_numbers ul,#wp_page_numbers li,#wp_page_numbers a{background:#fff;padding:0;margin:0;border:none;text-decoration:none;font-weight:normal;font-style:normal;list-style:none;text-transform:none;text-indent:0;font-variant:normal;text-align:left;line-height:12px;letter-spacing:0;word-spacing:0;} #wp_page_numbers{margin-top:10px;width:100%;background:#fff;} #wp_page_numbers ul{border-top:1px solid #ccc;width:100%;} #wp_page_numbers li{float:left;display:block;} #wp_page_numbers a{padding:3px;padding-left:5px;padding-right:5px;display:block;color:#aaa;font-family:Arial;font-size:12px;border-top:2px solid #fff;border-bottom:2px solid #fff;} #wp_page_numbers li a:hover{color:#ff00a4;border-top:2px solid #ff00a4;border-bottom:2px solid #f1f1f1;} #wp_page_numbers li.space{font-size:12px;font-family:Arial;color:#aaa;padding:3px;padding-left:5px;padding-right:5px;border-top:2px solid #fff;border-bottom:2px solid #fff;} #wp_page_numbers li.first_last_page{font-style:italic;} #wp_page_numbers li.active_page a{color:#fff;background:#45b9f6;border-top:2px solid #45b9f6;border-bottom:2px solid #45b9f6;} #wp_page_numbers li.active_page a:hover{color:#fff;border-top:2px solid #00679d;border-bottom:2px solid #45b9f6;} #wp_page_numbers li.page_info{float:left;font-size:12px;font-family:Arial;color:#aaa;display:block;padding:3px;padding-right:5px;border-top:2px solid #fff;border-bottom:2px solid #fff;} .wordtwit_tweets{margin:auto;text-align:center;} .wordtwit_tweets ul{margin:auto;width:100%;} .wordtwit_tweets ul img{width:35px;height:35px;float:left;margin-right:10px;margin-bottom:5px;} .wordtwit_tweets ul li{width:100%;text-align:left;line-height:1.2;padding:5px;} .wordtwit_tweets ul li.original{margin-bottom:5px;border:1px solid #ccc;} .wordtwit_tweets ul li.response{margin-bottom:5px;} .wordtwit_tweets ul li.original .join{float:right;} .wordtwit_tweets ul li.original .join a{color:#888;} .wordtwit_tweets ul li a{text-transform:capitalize;} .wordtwit_tweets ul li em{display:block;margin-bottom:5px;} .wordtwit_clearer{clear:both;} .recentcomments a{display:inline!important;padding:0!important;margin:0!important;} Code (markup):
Well, technically it's OK, other than lots of warnings about color and background color being the same. Some might consider this an attempt to hide text on the page. Also validation resulted in the following errors: 117 div.c-grav img Property -moz-border-radius doesn't exist : 4px 4px 117 div.c-grav img Property -webkit-border-radius doesn't exist : 4px 4px 118 div.c-body Property -moz-border-radius doesn't exist : 12px 12px 118 div.c-body Property -webkit-border-radius doesn't exist : 12px 12px You may want to put this stuff in a separate stylesheet with "if !IE" conditional comments. Although it is very difficult to read. You should not be afraid to use new lines and white space to make your css more readable. ul,ol{ list-style:none; } h1,h2,h3,h4,h5,h6,pre,code,p{ font-size:1em; } ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{ margin:0;padding:0; } a img,:link img,:visited img{ border:none; } Code (markup): would be far easier to read than: ul,ol{list-style:none;} h1,h2,h3,h4,h5,h6,pre,code,p{font-size:1em;} ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{margin:0;padding:0;} a img,:link img,:visited img{border:none;} Code (markup):
Unless you know why those lines are there, I would not delete them, but they only target Mozilla and webkit based browsers so you could put them in a separate file by themselves and then call the external css using conditional comments with the condition that the browser is not IE. That way they would only be loaded for non IE browsers If you don't know how to do this, then you could probably just leave them there and they would not likely cause any trouble except for your CSS not validating.
Please note: though the validator flags those as "doesn't exist", -vendor extensions are perfectly valid and spec'd properties in the W3C docs and anyone should feel free to use them.
They are currently only loaded by nonIE browsers anyway. Only Mozilla pays attention to -moz and only webkit-based browsers (nightly epiphanies, safari, chrome, etc) load -webkit stuff. They are safe to leave where they are.
Sorry, I guess I should have said "only visible to" instead of "only loaded by", but correct you are. However, some people, like me, like to have a linked icon to verify that my site is valid xHTML and valid CSS, especially being in the business of web design. If my site produced errors on validation, (even though the css itself may be valid), then it just doesn't look good to someone who may not be aware of the nuances. Therefore, I prefer to put these type of things in an external sheet by themselves and call them using a conditional comment. If error-free validation is not of concern, then by all means leave them be the way they are. My thought, based on the original post, was that someone must have run the css validator on jonaspt code and then told him he had invalid code. Putting that code behind conditional comments would hide it from the validator, and thus satisfy those trying to tell him he had code problems. But now that I think about it, I'm assuming the validator does not use the IE engine, so would a !IE conditional statement even hide the code from the validator?
Yes, the validator does not see code wrapped in IE Conditional Coments [if IE], nor does it see the Tan Hack (* html #element{styles for IE6;}). As a web designer I do not sport badges on any site I now make. I did back when I first started cause it seemed cool. My CSS never validates because I use CSS3 and check with the CSS2 validator (unless I happen not to have CSS3 on my site). Either way, it doesn't mean I'm going to spend GET requests on my clients' time with extra stylesheets. With the exception of the IE stylesheets called from within CC's (which only IE will spend server time calling), having extra stylesheets with code for other browsers is just a waste of bandwidth and server talk. Plus it removes the easy crtl+f I use to find all the code for some certain element in one place (not all people write their CSS the way I do though). I may also just be lucky I don't work for some design bureau who insists on working badges.