[HTML] CSS Problem mit Pseudo-element :first-letter

Psoido · 31. Oktober 2005

Hallo
Ich habe ein Problem mit dem angegebenem Pseudo-element :first-letter.
Dies soll als Hyperlink funktionieren.

Leider Leider funzt es im Firefox nicht so wie im IE.
Beim drüber gehen wird der anfangsbuchstabe klein.

hier der Link mit dem Beispiel
http://potsdama.de/test/index3
Weiß jemand Rat????

hier der Quellcode

Code:

<p><a href="#">TEXT</a></p>

Und der CSS-Code

Code:

CSS-Code
p:first-letter{font-size:30px;}
a {
text-decoration: none;
padding: 0.2em;
font-family: "Lucida Sans", Verdana, Arial, Helvetica, sans-serif;
font-size: 16.5pt;
color: #FFFFFF;
}
a:link {
}
a:visited {
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: underline;
}

ronny1978 · 1. November 2005

AW: CSS Problem mit Pseudo-element :first-letter

Wahrscheinlich hast du dein Problem schon gelöst wenn nicht

Code:

<html><head><title>:first-line, :first-letter, :first-child</title>
<style type="text/css">
p:first-line { font-weight:bold }
p:first-letter { font-size:300%; color:red }
div { background-color:#E0E0E0 }
div p:first-child { background-color:#C0C0C0; }

</style>
</head><body>

<p>Man kann nur Br&uuml;cken schlagen zwischen Ufern die man
auseinanderh&auml;lt. Denn wo es keine Gr&auml;ben gibt, da gibt es
auch keine Unterschiede, und wo es keine Unterschiede gibt, da ist kein
Leben.</p>
<div>
<p>Und die Moral von der Geschicht:</p>
<p>Traue Philosophen nicht!</p>
</div>
</body></html>

Benj · 1. November 2005

AW: CSS Problem mit Pseudo-element :first-letter

Das Problem liegt an deiner Verschachtelung, nicht an der Syntax, wie der Vorposter zu behaupten meint.

Wenn du in der Hierarchie-Ebene 1 (<p>) dem ersten Zeichen eine Größe von 30px, in der zweiten Hierarchie-Ebene aber den darin liegenden Link (<a>) allgemein eine Schriftgröße von 16.5pt zuweist, wird die zuletzt aufgerufene Zuweisung angewandt. Der Internet Explorer nimmt es dabei mal wieder nicht so genau und weist die Änderung erst bei einer Useraktion (Hover) zu.

Somit ist das Problem eigentlich gelöst, in dem du statt p:first-letter ganz einfach p a:first-letter benutzt.

Psoido · 3. November 2005

AW: CSS Problem mit Pseudo-element :first-letter

Hallo, danke für die Hilfe...aber

Das hab ich alles probiert, ewigkeiten.....
Aber da gibt es eine ganz einfache Lösung, die jedenfalss meine Anforderungen genügt.
mit

Code:

font-variant : small-caps;

macht er alle Kleinbuchstaben als Großbuchstabe behält aber ihre Größe, so das die schon vorherigen Großbuchstaben automatisch größer sind.
Schwer zu verstehen ich weiß, aber im Endeffekt sieht das ganze genau so aus...

TEXT

Suche

[HTML] CSS Problem mit Pseudo-element :first-letter

Psoido

Ensign

ronny1978

Cadet 4th Year

Benj

Commander

Psoido

Ensign

Ähnliche Themen