Reset defaults in HTML

After basic HTML is over, the next step comes is designing or beautifying your webpage… for that most of the people uses Cascading Style Sheet (a.k.a CSS) but many of newbies don’t know that your web browser has some inbuilt or predefined CSS rules which they apply to your webpage. For example if you use Google Chrome , when ever you click on any textbox, by default it will be highlighted with a glowing yellowish border (See the image below) this is done by your web browser and you will see many such effects which vary according to your web browser.

That was just an example to show that your browser definitely applies some inbuilt CSS rules which include

padding, :hover, list-style, border and many more…

So a very simple method which is used by me to clean the browser’s predefined CSS rules if to use this script

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
margin:0;
padding:0;
}

body {
line-height:1;
}

ol,ul {
list-style:none;
}

blockquote,q {
quotes:none;
}

blockquote:before,blockquote:after,q:before,q:after {
content:none;
}

:focus {
outline:0;
}

ins {
text-decoration:none;
}

del {
text-decoration:line-through;
}

table {
border-collapse:collapse;
border-spacing:0;
}

This is my best practice to include this reset.css , it wont only give you complete access to your webpage, but also removes some Arrhenius display errors… 😀
Have a good day