Rozdielne zobrazenie stránky v HTML5 oproti HTML4

Zdravím!
Vedel by mi niekto poradiť, čo spôsobuje rozdielne zobrazenie obrázkov pod rôznymi doctype (html4 a html5). Pokiaľ dokumentu nastavím doctype html5 a nezmením nič iné, tak druhý obrázok sa mierne posunie dole. Prikladám živé ukážky: HTML4 vs HTML5

Všimnite si posun druhého obrázka smerom dole v html5 ukážke (v oboch je vynulovaný border, padding aj margin, aby bolo jasné, že to nespôsobujú tieto vlastnosti). Obe ukážky sa zobrazujú v štandardnom režime prehliadačov. Jedná sa o nový spôsob zobrazovania prvkov v prehliadačoch, alebo čo spôsobuje problém? Ako sa medzery zbaviť?

Vďaka

panther:
áno, na to ma už upozornil shaggy, avšak display:block nemôžem použiť na svojej stránke (kód je komplikovanejší, je len zjednodušený v ukážke).
Navyše podobné rozdiely nevznikajú len pri použití obrázku, ale napríklad aj tam, kde obrázky nie sú použité: abeceda v html4 vs abeceda v html5. Tu je zaujímavé to, že ak odstraním vlastnosť font-size, rozdiely zmiznú html4 bez font-size vs html5 bez font-size.

Nerobí mi problém použiť html4 doctype, alebo medzery poupravovať, zaujíma ma skôr prečo takéto rozdiely vznikajú. Je nejako inak aplikovaný box-model v html5 oproti html4? Alebo v akých veciach sa líšia?

tiso:
vďaka, to pomohlo, vyriešie to problém s obrázkami. Vieš aj prečo sa to deje, čo je inak implementované? Čo tá abeceda? :)

Bubák:
Vďaka za info!