开发者

Text contained in box shows up with top padding in browser, but not in fiddle

I have been witnessing this weird behavior since last night.

Here's the fiddle: http://jsfiddle.net/Gqndm/

and here is a screenshot of what I get in all the major browsers on my machine: http://i.stack.imgur开发者_如何转开发.com/Bl3ve.png

Any idea as to why the text appears to be pushed down in the box (e.g. not being at the very top of the box, like in the fiddle).

Thanks for your help


jsFiddle imports a CSS file called normalize.css with the following CSS...

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

As you can see, p and div elements have their margin and padding set to 0.

This effectively normalises all browser's default stylesheets. If you included this CSS in your other browser tests, no doubt you will see the same that is in jsFiddle.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜