Beiträge von LinuxDude

    Die Erklärung ist, dass per Default die vertikale Ausrichtung von Elementen baseline ist. Das wird hier erklärt:
    ......

    Beheben kannst Du es leicht, indem Du für das Canvas vertical-align: top; setzt. Eine Alternative ist display: flex; für das div weil dann die vertikale Ausrichtung durch align-items bestimmt wird.


    Vielen vielen Dank für deine Analyse und den Lösungsvorschlag! Darauf wäre ich wohl im Leben nicht gekommen!
    Ich hoffe bald dazu zu kommen einen Patch einzureichen, werde dich dankend erwähnen.

    Hallo allerseits,


    Ich stehe gerade vor einem Rätsel, was die Darstellung von Framework-generiertem HTML angeht.


    Einer div-Box, die absolut positioniert ist (das Framework berechnet das Layout server-seitig), wird als einziges Kind-Element ein Canvas hinzugefügt - in den Entwicklertools sieht das wie folgt aus:

    Code
    <div tabindex="8" style="position: absolute; opacity: 1; overflow: hidden; outline: none; z-index: 2; border-width: 0px; border-style: none; width: 109px; height: 8px; left: 15px; top: 29px;">
    <canvas width="109" height="8" style="width: 109px; height: 8px;"></canvas>
    </div>


    Was mich nun verwirrt, ist, dass in der "richtigen" Anwendung das Canvas mit einem offset zur Oberkante des divs ge-layouted wird (im Beispiel oben hat das Canvas z.B. offsetTop = 6).

    In der Anwendung kommen mehrere solche Div/Canvas-Verschachtelungen vor, dieser Offset scheint umso ausgeprägter zu sein, je kleiner die Elemente sind.

    Ändere ich das Canvas von display=inline auf display=block verschwindet dieser Offset.
    Kopiere ich nur diese beiden Elemente in ein leeres HTML-File, gibt es keinen Abstand - egal ob display=inline oder block.


    Betrachtet mit den Entwicklertools sind selbst in der richtigen Anwendung padding/margins/border der beiden Elemente konsistent 0px:

    Canvas:

    html-seminar.de/woltlab/attachment/3146/


    Div:


    html-seminar.de/woltlab/attachment/3147/:


    Habt ihr eine Idee, woher diese 6px offset stammen könnten / wer/was diese verursacht?

    Tritt sowohl mit Chome als auch Firefox auf.

    Danke & lg, Clemens