In einem Projekt hatte ich eben ein JavaScript, welches die Höhe eines divs an die reale Höhe des ersten Kindelementes anpasst.

var id = document.getElementById('div');
id.style.height=(id.firstChild.offsetHeight+20)+"px";

Nach einer Änderung am Inhalt des divs funktionierte auf einmal das Verändern der Höhe nicht mehr. Die Ausgabe von id.firstChild brachte nur ein plumpes undefined zu Tage.

Lösung des Problems waren Leerzeichen zwischen dem div-Tag und dem Kindelement. Durch den Umbau des div-Inhaltes haben sich die Leerzeichen eingeschichen. Nachdem diese wieder entfernt wurden, ging wieder alles.

Durch die Leerzeichen wurden die Kindelemente nicht erkannt. Der Browser ging davon aus, dass nur reiner Text in dem div ist. Darauf muss man auch erstmal kommen...

Es gibt die Möglichkeit Bilder direkt in ein HTML Dokument einzubinden. Also ohne Bilderdatei.

Beispiel (Server):

$file = base64_encode(file_get_contents( "file.png" ));
echo "<img src='data:image/gif;base64,".$file."' alt='base64 Test'>";

Beispiel (Client):
[...] Weiterlesen...