Font-Größe ändert sich nach Einfügen eines DIV

  • CSS

Es gibt 2 Antworten in diesem Thema. Der letzte Beitrag () ist von Marcus Gräfe.

    Font-Größe ändert sich nach Einfügen eines DIV

    In folgendem HTML-Code habe ich zwei Textzeilen ("Bezeichnung 1" und "Bezeichnung 2"). Diese sollen beide die in der Klasse smallfont2 definierte Font-Größe haben. Leider hat nur die erste diese Größe, die 2. ist größer. Es liegt eindeutig am DIV. Entferne ich das erste <div></div>, so sind beide Zeilen gleich groß. Warum? Was setzt das DIV intern zurück?

    HTML-Quellcode

    1. <form>
    2. <p>
    3. Firma:<br />
    4. <span class="smallfont2">Bezeichnung 1:</span>
    5. <div></div>
    6. <span class="smallfont2">Bezeichnung 2:</span>
    7. <div></div>
    8. </p>
    9. </form>

    CSS-Quellcode

    1. .smallfont2 {
    2. font-size: 75%;
    3. }
    4. form p {
    5. font-size: 80%;
    6. }

    Zum Ausprobieren: jsfiddle.net/g9dhxcmk/
    Besucht auch mein anderes Forum:
    Das Amateurfilm-Forum
    Guten Abend,

    Meines wissens sind innerhalb von Paragraphen(<p>) keine anderen Blöcke (also auch <div>) erlaubt.
    Siehe dazu: wiki.selfhtml.org/wiki/HTML/Te…elemente_in_Abs.C3.A4tzen.

    Wenn ich mir das im Inspektor meines Browsers (Firefox) anschaue, wird dein Code wie folgt geändert:

    HTML-Quellcode

    1. <form>
    2. <p>
    3. Firma:<br>
    4. <span class="smallfont2">Bezeichnung 1:</span>
    5. </p><div></div>
    6. <span class="smallfont2">Bezeichnung 2:</span>
    7. <div></div>
    8. <p></p>
    9. </form>



    Du müsstest also deine Texte Beispielweise einzeln in <p>s packen, oder auf die <div>s (und auch andere Block-Elemente) verzichten.

    Grüße
    こんにちわ
    Achte beim stellen von Fragen auf eine genaue Fragestellung, mir passiert das selbst häufig, andere können dir dann nicht so gut helfen.