Firefox and Google Chrome css not the same?

Question

When I test this

http://www.andrewsellick.com/examples/sliding-side-bar/#

results are buggy and not the same.

Don't both based on the same standard ?

Answer 1

Every browser has it's own default styles.

You should un-apply the browser defaults with a "reset" stylesheet (here is mine):

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,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;
}

ul                              { list-style-type: none; }
ol                              { list-style-type: decimal; }

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;
}


html, body                      { line-height: 1; }
blockquote:before, blockquote:after, q:before, q:after         { content: ''; }
blockquote, q                   { quotes: "" ""; }


*                               { font-family: Verdana, "Trebuchet MS", sans-serif;
                                  font-size: 13px; color: #666;
                                  text-decoration: none; white-space: normal;
                                  vertical-align: baseline; }

input[text="submit"], button    { color: #000; }

Answer 2

HTML and CSS are rendered by each browser how they think it is better, based on some conditions. This can be done without violating the standard.

Think about it like two people reading a common text: their voices differ even if they both are reading it correctly.

That said, if you told us more in detail what you would expect to see, we would be able to actually help you.