CSS - Consistency
September 20th, 2007 Posted in Web DesignEvery product is different; some drinks are fizzier than others. This is because there is no right answer and it comes down to what the manufacturer thinks is best. And browsers are no exception.
Cascading Style Sheets (CSS) simplifies web development in an arbitrary number of ways by reducing complexity and improving semantic structure, but the one thing that really!, really! bugs me about CSS is how some browsers have different and sometimes strange defaults.
This can cause problems down the line for developers, so the best way to get round this is to zero the defaults. Yahoo developer have a very good solution for this called the “reset.css”
/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.3.1
*/
body {color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:”;}
abbr,acronym {border:0;font-variant:normal;}
sup,sub {line-height:-1px;vertical-align: text-top;}
sub {vertical-align:text-bottom;}
input, textarea, select{font-family:inherit;font-size:inherit;font-weight:inherit;}
It would be nice to have someway of saying to the browser “Hey! I want to set everything to 0″. It worries me that Microsoft might realize this and we’ll end up with some obscure Internet Explorer conditional comment to do it…
*shudders* Standards are becoming more and more important and I’m pretty sure Microsoft won’t walk down that kind of road again, but hey! you never know.