In Safari/Chrome it has extra spacing on the left/top of ol's, blockquotes and other elements.
I can't isolate this, however when I look in the web inspector in Safari, its picking up a margin-left: of 26px on some elements. I have not specified any such rules, so is this a bug in Web inspector?
Can someone enlighten me as to why these exta spacing problems are occurring? Thanks!
That margin-left:26px is the "computed style" of your styling margin-left:2em. Hence why it's under Computed Style section in Safari's Web Inspector. So if you change your margin-left to some other values the computed-style pixel value will also change too.
Anyway there are indeed extra padding! And it's caused by the user agent stylesheet (-webkit-padding-start:40px). Reset this style by setting padding:0 on your ol and any others elements you want.
A good way to prevent this problem from happening again and develop without worry is to reset your css. A basic reset would be:
*{ margin:0; padding:0; }