CSS - Frage

[nicki1124]

Hi,
ich beschäftige mich erst seit kurzem mit diesem Thema und habe folgende Frage an euch.
ich möchte folgendes: 23.Nicki

Hier die CSS
.23 {
color: #1b75bc;
font-weight: bold;
font-size: 14pt;
}
.dot
color: #ff0000;
}
.nicki {
color: #1b75bc;
font-size: 10pt;
}

wie bitte bekomme ich das auf der Webseite in dem Text so hin?
Danke für die Hilfe!
LG Nicki

 

[heckmeck]

Hallo,
nach deinem .dot fehlt eine {

Der rets ginge z.B. so:
<span class="23">23</span><span class="dot">.</span><span class="nicki">Nicki</span>

 

[heckmeck]

Oder REST / statt rets ;-)

 

[dn3d_fanboy]

Die Klasse .23 wird ignoriert, da Klassen und IDs nicht mit Zahlen beginnen dürfen. ;-)

Die Klasse "dot" könntest du dir eigentlich auch sparen, da du hier mit dem Pseudoelement :after arbeiten könntest. Also:

.23:after {
color: #ff0000;
content: '.';
}

Wobei, wie oben geschrieben, dann .23 in eine korrekte Klasse geändert werden müsste.

 

[dn3d_fanboy]

Hier hast du mal den kompletten Code:

https://jsfiddle.net/98ksmbry/1/

 

[Curanai]

... und bitte nicht mit "pt" als Einheit arbeiten.

 

[Myhar]

Die Klasse "dot" könntest du dir eigentlich auch sparen, da du hier mit dem Pseudoelement :after arbeiten könntest. Also:

Sind Inhalte, die mit :after erzeugt werden auch korrekt im DOM-Fluss enthalten? Also sprich steht dort dann wirklich 23. wenn ich mir das vorlesen lasse? Soweit ich weiß kann das nicht immer garantiert werden. Deshalb ist es immer besser, alles was auch wirklich zum Inhalt zählt, im Inhalt zu belassen. Dazu gehört in dem Fall auch der Punkt.
Unwichtigen Inhalt, welcher nicht direkt mit dem Inhalt zu tun hat, kann man getrost mittels ::after, ::before generieren.

 

[dn3d_fanboy]

Sind Inhalte, die mit :after erzeugt werden auch korrekt im DOM-Fluss enthalten? Also sprich steht dort dann wirklich 23. wenn ich mir das vorlesen lasse? Soweit ich weiß kann das nicht immer garantiert werden. Deshalb ist es immer besser, alles was auch wirklich zum Inhalt zählt, im Inhalt zu belassen. Dazu gehört in dem Fall auch der Punkt.
Unwichtigen Inhalt, welcher nicht direkt mit dem Inhalt zu tun hat, kann man getrost mittels ::after, ::before generieren.

Gut, das ist natürlich ein Argument.