KOMPOOS.NL

css reset

home » css » reset-css-html5.html

sitemap


uitleg css reset

Browsers hebben allemaal hun eigen manier om een webpagina weer te geven. Nu is het overdreven om in elke browser een web-pagina exact hetzelfde er uit te laten zien. Als iemand in Google's Chrome een pagina bezoekt, gaat hij echt niet in Mozilla de pagina nogmaals openen om uit te zoeken of de pagina, "tot op de duizendste millimeter nauwkeurig", hetzelfde wordt weergegeven. Wat wel belangrijk is, is om er voor te zorgen dat alle "html5-zaken" door alle browsers, in ieder geval, worden weergegeven. Totdat alle browsers (volledig) html5 ondersteunen, kan je het beste de "problematische" html5-items proberen te vermijden. In de tussentijd kan je, om alle pagina's van jouw website er correct (lees: bijna hetzelfde) uit te laten zien (en "html5" te laten functioneren) gebruik maken van onderstaande stylesheet. Plaats de stylesheet in de head-sectie van jouw pagina (of plaats het in een extern css-bestand).

stylesheet die de CSS "reset"


<style type="text/css">
        html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,
        small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,
        a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,
        fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,
        article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup, 
        menu,nav,output,ruby,section,summary,time,mark,audio,video{
                margin:0;
                padding:0;
                border:0;
                font-size:100%;
                font:inherit;
                vertical-align:baseline}
        body{
                line-height:1}
        ol,ul{
                list-style:none}
        table{
                border-collapse:collapse;
                border-spacing:0}
        blockquote,q{
                quotes:none}
        blockquote:before,blockquote:after,q:before,q:after{
                content:'';
                content:none}
        article,aside,details,figcaption,figure, 
        footer,header,hgroup,menu,nav,section{
                display:block}
</style>
Gebruik voor alle voorbeelden op de http://kompoos.nl een valide html5 pagina.