franzsen: Wirkung von outline

Habe folgenden Code begonnen und erhalte schon anfangs ein Ergebnis das noch nicht passiert ist:

<!doctype html>
<html lang="de">
<meta name="viewport" content="width=device-width, initial-scale=1">
<head>
   <meta charset="utf-8">
  <title></title>
<style>
.test {
  /*position: absolute;*/
  padding: 20px;
  color: red;
  outline: 2px solid;
  color red;
  }
</style>
</head>

<body>
<abbr class="test">
  <dfn>
    Text Hallo<br>
    Text 2<br>
    Text 3<br>
  </dfn>
</abbr>
</body>
</html>

Die Außenlinie geht senkrecht durch die erste Textzeile. Wenn ich <br> weggebe fällt der Rahmen normal; schreibe ich "display: box;", passiert überhaupt nichts, jedoch mit "position: absolute;". "relative" ist ebenfalls wirkungslos.

Was passiert da?

--
LG Franz
  1. Hallo,

    du wendest HTML (mal wieder) praxisfremd an und verwendest dazu CSS wie es nicht vorgesehen ist. Was erwartest du dann?

    Weder HTML noch CSS sind dafür gedacht jede falsche Verwendung abzufangen oder durch Warnhinweise abzusichern.

    Deshalb immer wieder der Rat: Erst du Grundlagen lernen, dann Webseiten erstellen. Dabei gibt es genügend Klippen, die erfolgreich umschifft werden wollen.

    Gruss

    MrMurphy

    1. @@MrMurphy1

      Dabei gibt es genügend Klippen

      Bin ich der einzige, der hier „Krippen“ gelesen hat? Könnte am Datum liegen. Frohes Fest!

      LLAP 🖖

      --
      „Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
      „Hat auf dem Forum herumgelungert …“
      (Wachen in Asterix 36: Der Papyrus des Cäsar)
      1. Hallo,

        Bin ich der einzige, der hier „Krippen“ gelesen hat? Könnte am Datum liegen. Frohes Fest!

        Oder hast du zu lange in China gelebt? Wünsche auch eine flohe Klippenfeielei!

        Gruß
        Kalk

  2. @@franzsen

    Habe folgenden Code begonnen

    Den du bitte das nächste Mal als Online-Beispiel bereitstellst.

    <!doctype html>
    <html lang="de">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <head>
    

    Fehler: html darf nur head und body als Kindelemente haben. Das meta-Element gehört in den head – und zwar hinter die Angabe zur Zeichencodierung.

    Die Außenlinie geht senkrecht durch die erste Textzeile. Wenn ich <br> weggebe fällt der Rahmen normal

    Ich denke mal, duch br erhältst du einzelne Textboxen, die alle jeweils ihre eigenen Outline haben.

    schreibe ich "display: box;", passiert überhaupt nichts

    Was nicht verwundern sollte; ist doch "box" kein gültiger Wert für display.

    LLAP 🖖

    --
    „Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
    „Hat auf dem Forum herumgelungert …“
    (Wachen in Asterix 36: Der Papyrus des Cäsar)
    1. Fehler: html darf nur head und body als Kindelemente haben. Das meta-Element gehört in den head – und zwar hinter die Angabe zur Zeichencodierung.

      Schon korrigiert.

      Die Außenlinie geht senkrecht durch die erste Textzeile. Wenn ich <br> weggebe fällt der Rahmen normal

      Ich denke mal, duch br erhältst du einzelne Textboxen, die alle jeweils ihre eigenen Outline haben.

      Wahrscheinlich, denn wenn ich diese weg lasse, funktioniert es ja (dann natürlich in einer Zeile) aber ich wollte mit "dfn" und "abbr" ein wenig basteln. Sind also nur inline zu bevorzugen.

      schreibe ich "display: box;", passiert überhaupt nichts

      Was nicht verwundern sollte; ist doch "box" kein gültiger Wert für display.

      Sollte natürlich "block" heißen; ändert aber nichts an der Wirkung. Inzwischen habe ich diese Übung schon verworfen.

      --
      LG Franz