I’ve been playing with making an HTML5 video player with custom controls, and I’ve come across an unusual vertical space beneath <video> elements. I can’t work out where it’s coming from or how to make it disappear without some ugly pixel jogging.
I’m seeing this on Firefox, Safari and Chrome, and I’ve tried the usual tricks of nuking both margins and padding, playing with borders, etc. The html markup is very simple: just follow a video element with another block element, eg.:
I’m a block element beneath a video element. But why am I jogged down 3 or 4 pixels?