Get rid of padding/margin around <canvas> element?

I had similar problem, the absolutely positioned div with canvas inside (added via JS so no extra spaces around) was causing overflow on page when I positioned div at the bottom of the page.

The solution was to set canvas display property to 'block' (didn't know it's 'inline-block' by default at the time) and now no extra padding is added and scrollbars are gone.

As you've correctly noted, browsers implement default styles for various HTML elements (and they're not standardised, so every browser implements slightly different defaults). For your purposes, given your posted HTML, you'd need something like the following:

html, body, div, canvas {
    margin: 0;
    padding: 0;
}

This does, of course, over-simplify things and it might be worth setting font-size and default color and background-color properties too (among many, many others).

References:

• CSS Reset Reloaded, by Eric Meyer.
• YUI reset.
• And there are many others, though I really can only think of those two, the css-reset might be of use to you, though.