portseven: Bilder mit Text

Tag liebe com,

Ein User kann ein Text schreiben z.b ein Artikel über Tiere or whatever.

Jetzt möchte ich es so machen das dahinter immer ein Hintergrundbild definiert ist und der Text mitten im Bild ist. Das Bild soll sich nach Länge des Textes automatisch anpassen. Ist das möglich? Ich könnte den Text mit position:absolute machen, das ich den Text ins Bild anpassen, aber wenn sich der Browser einmal bissl verschiebt sieht das sehr erschreckend aus.

Gibt es andere Möglichkeiten?

  1. Hallo portseven,

    Jetzt möchte ich es so machen das dahinter immer ein Hintergrundbild definiert ist und der Text mitten im Bild ist. Das Bild soll sich nach Länge des Textes automatisch anpassen. Ist das möglich?

    Definiere anpassen. Soll bei kurzen Texten nur die Mitte des Bildes zu sehen sein oder das Bild verkleinert werden?

    Ich könnte den Text mit position:absolute machen, das ich den Text ins Bild anpassen, aber wenn sich der Browser einmal bissl verschiebt sieht das sehr erschreckend aus.

    Du könntest einfach ein Hintergrundbild verwenden.

    Bedenke jedoch, dass ein Hintergrundbild hinter einem Text die Lesbarkeit desselben unter Umständen stark beeinträchtigen kann. Selbst für Menschen, die wie ein Adler sehen können.

    Bis demnächst
    Matthias

    -- Rosen sind rot.
  2. @@portseven

    Tag liebe com,

    Wir sind hier nicht kommerziell. (Schade eigentlich, sonst wäre ich reich. 😉)

    Jetzt möchte ich es so machen das dahinter immer ein Hintergrundbild definiert ist

    Mit „ein Hintergrundbild“ meinst du ein Hintergrundbild background-image? Die von dir gewählten Tags HTML und PHP (was damit überhaupt nichts zu tun hat) lassen anderes vermuten …

    Ich könnte den Text mit position:absolute machen,

    … und das dies befürchten.

    Nein, das kannst du nicht. position: absolute nimmt die Textbox aus dem Elementfluss, d.h. nachfolgende Elemente werden so positioniert, als ob es die Textbox nicht gäbe. Das ist bei Text, dessen Länge du nicht kennst, überhaupt keine gute Idee.

    Du willst ein Hintergrundbild.

    Das Bild soll sich nach Länge des Textes automatisch anpassen. Ist das möglich?

    Ja, mit background-size.

    (☝︎ Das ist ein Link. Dass der kaum als solcher zu erkennen ist, halte ich für einen groben Fehler im Forum-Stylesheet.)

    Je nachdem, was du willst, dürften die Werte contain oder cover für dich interessant sein. Oder auch 100% 100%.

    LLAP 🖖

    -- „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
    1. Hallo Gunnar Bittersmann,

      Ja, mit background-size.

      (☝︎ Das ist ein Link. Dass der kaum als solcher zu erkennen ist, halte ich für einen groben Fehler im Forum-Stylesheet.)

      Du könntest doch auch in diesen Fällen lösungsorientiert und nicht problemorientiert antworten. Wie sieht dein Vorschlag aus?

      Bis demnächst
      Matthias

      -- Rosen sind rot.
      1. @@Matthias Apsel

        Ja, mit background-size.

        (☝︎ Das ist ein Link. Dass der kaum als solcher zu erkennen ist, halte ich für einen groben Fehler im Forum-Stylesheet.)

        Du könntest doch auch in diesen Fällen lösungsorientiert und nicht problemorientiert antworten. Wie sieht dein Vorschlag aus?

        Rahmen und Hintergrundfarbe bei Inline-Code wegmachen. (Bei Gut und Böse soll deren Hintergrundfarbe natürlich bleiben.)

        Inline-Code hebt sich durch dicktengleiche Schrift vom übrigen Fließtext ab, der in Proportionalschrift gesetzt wird. (Das ist immer noch nicht default, oder?)

        LLAP 🖖

        -- „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
        1. Hallo Gunnar Bittersmann,

          Rahmen und Hintergrundfarbe bei Inline-Code wegmachen. (Bei Gut und Böse soll deren Hintergrundfarbe natürlich bleiben.)

          Grundsätzlich? Nur für a code? Ich wäre für letzteres. Zu der Gestaltung von inline-code hatten wir auch eine lange Diskussion. Beim Umherspielen finde ich ein größeres Schriftgewicht für inline-code gar nicht schlecht.

          Inline-Code hebt sich durch dicktengleiche Schrift vom übrigen Fließtext ab, der in Proportionalschrift gesetzt wird. (Das ist immer noch nicht default, oder?)

          Nein (also ja), und auch das wurde lang und breit diskutiert.

          Bis demnächst
          Matthias

          -- Rosen sind rot.
    2. Hallo Gunnar,

      Wir sind hier nicht kommerziell. (Schade eigentlich, sonst wäre ich reich. 😉)

      Na ja vielleicht nicht "Richie Rich" reich aber doch zumindest ein nettes Zubrot.

      Rechenbeispiel:

      Du hast 31.974 Beiträge verfasst, davon bereits an Bewertungen(und die gabs ja nicht schon immer) 17.128 Punkte. Bei der Punktezahl kann man davon ausgehen, dass min. 5% der Beiträge jemand so geholfen hat, dass er dir freiwillig 1-10 Euro Euro dafür gespendet hätte, dann wären (31.974/20)*5 = 7993,50 Euro. Das halte ich für realistisch.

      Wobei das nicht mal kommerziell sein müsste, hatte ja schon mal einen Vorschlag dazu gemacht.

      Je nachdem, was du willst, dürften die Werte contain oder cover für dich interessant sein. Oder auch 100% 100%.

      Was nicht unbedingt immer, wie erwartet/gewünscht, funktioniert

      Gruss
      Henry

    3. hallo

      Ja, mit background-size.

      (☝︎ Das ist ein Link. Dass der kaum als solcher zu erkennen ist, halte ich für einen groben Fehler im Forum-Stylesheet.)

      Ich kann den Link gut erkennen dadurch dass er blau unterstrichen und bläulich hinterlegt ist. Mein Forum-css ist immer noch Jungfrau. In welchem Kontext hast du den Link anders wahrgenommen?

      1. Hallo beatovich,

        In welchem Kontext hast du den Link anders wahrgenommen?

        background-size vs. background-size

        Bis demnächst
        Matthias

        -- Rosen sind rot.