mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Fr 19.04.2024 12:47 Benutzername: Passwort: Auto-Login

Thema: CSS: Kleine Grafik an Ende des Texts einblenden vom 04.05.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> CSS: Kleine Grafik an Ende des Texts einblenden
Seite: 1, 2  Weiter
Autor Nachricht
TOMillr
Threadersteller

Dabei seit: 21.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst So 04.05.2008 23:27
Titel

CSS: Kleine Grafik an Ende des Texts einblenden

 Antworten mit Zitat Zum Seitenanfang
Hallo zusammen,

habe den Fließtext einer Seite in einen DIV Container ("Artikel" gepackt, um diesen zu formatieren und automatisch über first-letter eine Initiale anzeigen zu lassen. Möchte nun zusätzlich am Ende des Texts abschließend eine kleine Grafik einblenden lassen.

Kann ich das mit CSS irgendwie automatisieren, damit die Benutzer des CMS da keinen Code anpassen müssen?

Danke,
TOM
  View user's profile Private Nachricht senden
rob

Dabei seit: 11.12.2003
Ort: ~/
Alter: 46
Geschlecht: Männlich
Verfasst So 04.05.2008 23:36
Titel

Antworten mit Zitat Zum Seitenanfang
Siehe: SelfHTML -> Stylesheets (CSS) -> CSS-Eigenschaften -> Pseudoelemente und Pseudoklassen -> Pseudoelemente für automatisch generierten Inhalt
  View user's profile Private Nachricht senden
Anzeige
Anzeige
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Mo 05.05.2008 00:30
Titel

Antworten mit Zitat Zum Seitenanfang
Aber beachte dort den Hinweis, dass kein einziger IE das kann *zwinker*
  View user's profile Private Nachricht senden
beeviZ

Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 05.05.2008 01:16
Titel

Antworten mit Zitat Zum Seitenanfang
bind das ding als background image mit background position top/bottom/center und right ein.
  View user's profile Private Nachricht senden
TOMillr
Threadersteller

Dabei seit: 21.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 05.05.2008 09:57
Titel

Antworten mit Zitat Zum Seitenanfang
Mir ist gestern Abend im Bett noch folgende Idee gekommen:
Ich werde es einfach direkt im Quellcode einbinden, in dem ich einfach nach dem DIV mit dem $content dahinter einen weiteren DIV mit der Grafik setze. Oder endet ein Div Container nicht direkt jeweils am Textende sondern "quadratisch" wie eine Tabelle?

<div1>$content<div2>Grafik</div></div>

Zuletzt bearbeitet von TOMillr am Mo 05.05.2008 09:58, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Mo 05.05.2008 10:28
Titel

Antworten mit Zitat Zum Seitenanfang
beeviZ hat geschrieben:
bind das ding als background image mit background position top/bottom/center und right ein.

Dann wird es allerdings nahezu nie hinter dem letzten Wort des Textes stehen, der ja auch mal mitten in der Zeile enden kann. Oder er endet tatsächlich ganz rechts und überdeckt das Bild. Und padding-right für das Elternelement würde wiederum die Grafik einfach immer nur neben dem kompletten Text erscheinen lassen.

@CrazyLexx: Wenn Du es direkt ins Markup einbinden willst, brauchst Du dafür kein div, sondern stellst die Grafik einfach hinter das letzte Wort des Textes, dann wird sie immer genau rechts vom letzten Wort angezeigt, und das ist ja wohl das, was Du vorhast.

Die Frage ist allerdings, ob diese Grafik inhaltlich relevant ist - wahrscheinlich nicht, und dann gehört sie ins CSS. Ein span um's letzte Wort kann padding-right erhalten und die Grafik als Hintergrund. Wie Du das dem CMS beibringst, ist natürlich eine andere Frage *zwinker* Anderfalls tut's auch ein leeres span (hinter dem letzten Wort), das die Grafik als Hintergrund erhält.
  View user's profile Private Nachricht senden
TOMillr
Threadersteller

Dabei seit: 21.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 05.05.2008 12:01
Titel

Antworten mit Zitat Zum Seitenanfang
heiko_rs hat geschrieben:

Die Frage ist allerdings, ob diese Grafik inhaltlich relevant ist - wahrscheinlich nicht, und dann gehört sie ins CSS.

Genau, ist nur eine grafische Spielerei.

heiko_rs hat geschrieben:

Anderfalls tut's auch ein leeres span (hinter dem letzten Wort), das die Grafik als Hintergrund erhält.

Du meinst sowas wie:

Code:

<DIV>$content<SPAN mit Hintergrundgrafik im CSS></SPAN></DIV>

Muss ich dann zwischen die SPAN Text irgendwie noch ein Leerzeichen setzen oder wird das auch so von "allen" Browsern korrekt angezeigt?
  View user's profile Private Nachricht senden
TOMillr
Threadersteller

Dabei seit: 21.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 05.05.2008 13:41
Titel

Antworten mit Zitat Zum Seitenanfang
Habe es dann mal so probiert:
Code:

<DIV>$content<SPAN mit Hintergrundgrafik im CSS></SPAN></DIV>


Damit habe ich leider das Problem, dass der $content Bereich mit einem </p> Tag endet und ich dann die Grafik im Span nicht direkt an den Text anliegend sondern in einem neuen Paragraphen angezeigt bekomme (also als würde ich zweimal auf Enter drücken und die Grafik nach unten in einen neuen Abschnitt verschieben). Kann ich das irgendwie unterbinden?
  View user's profile Private Nachricht senden
 
Ähnliche Themen div layer bei klick aus/einblenden?!
bilder in div containern per js einblenden
Wechselbild und Text einblenden
Flash- Bei Grafik-Mouseover soll Grafik vergrößert werden.
text mit javascript bei klick einblenden
Einen Infotext am Link einblenden
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB