CSS: li::before

[Fahri]

Hallo,

ich habe ein problem mit CSS.

			li:before {
				 content: "\e063";
				font-family: 'Glyphicons Halflings';
				font-size: 13px;
				float: left;
				margin-top: 4px;
				margin-left: -20px;
				color: #3498db;
			}

Wie kann ich dafür sorgen das es nur in einem speziellem DIV funktioniert?

divname li:before scheint nicht zu funktionieren.

[Christian Kruse]

Hallo Fahri,

divname li:before scheint nicht zu funktionieren.

Ist dir bewusst, dass der ID-Selektor mit einer vorangestellten Raute funktioniert? Also z.B. #divname li:before?

Ansonsten würde ich an deiner Stelle wenn möglich eher mit einer Klasse arbeiten.

LG,
CK

[Gunnar Bittersmann]

@@Christian Kruse

Ansonsten würde ich an deiner Stelle wenn möglich eher mit einer Klasse arbeiten.

Äh, nein. Wieso?

Wie kann ich dafür sorgen das es nur in einem speziellem DIV funktioniert?

„in einem speziellen DIV“

Genau dafür sind ID-Selektoren gedacht.

LLAP 🖖

[Christian Kruse]

Hallo Gunnar,

Ansonsten würde ich an deiner Stelle wenn möglich eher mit einer Klasse arbeiten.

Äh, nein. Wieso?

Äh, doch. Erfahrungswert: nahezu immer ist eine Klasse gemeint, keine ID.

Wie kann ich dafür sorgen das es nur in einem speziellem DIV funktioniert?

„in einem speziellen DIV“

Genau dafür sind ID-Selektoren gedacht.

Nahezu immer ist aber nicht „ein spezielles DIV“ gemeint sondern „eine spezielle Art div.“

LG,
CK

[Gunnar Bittersmann]

@@Christian Kruse

Äh, doch. Erfahrungswert: nahezu immer ist eine Klasse gemeint, keine ID.

Nein.

Ich hab da andere Erfahrungen.

Nahezu immer ist aber nicht „ein spezielles DIV“ gemeint sondern „eine spezielle Art div.“

Nein.

Und wenn der Theo sagt „ein spezielles DIV“, dann besteht wenig Grund zur Annahme, dass er „eine spezielle Art div“ meinte.

LLAP 🖖

[Christian Kruse]

Hallo Gunnar,

Und wenn der Theo sagt „ein spezielles DIV“, dann besteht wenig Grund zur Annahme, dass er „eine spezielle Art div“ meinte.

Das sehe ich völlig anders.

Edit:

Ich hab da andere Erfahrungen.

Das würde mich in der Tat aber doch mal interessieren. Magst du das mal erläutern?

LG,
CK

[Matthias Apsel]

Hallo Gunnar Bittersmann,

Nahezu immer ist aber nicht „ein spezielles DIV“ gemeint sondern „eine spezielle Art div.“

Und wenn der Theo sagt „ein spezielles DIV“, dann besteht wenig Grund zur Annahme, dass er „eine spezielle Art div“ meinte.

Die Fragestellung lässt darauf schließen, dass der TO recht unerfahren ist. ID-Selektoren sind „böse“, zumindest falsch eingesetzte ids.

Was tatsächlich die bessere Wahl ist, lässt sich schwerlich ohne weitere Kenntnis sagen. ID-Selektoren können einem das Leben tatsächlich schwer machen, wie ich selbst am Wiki-CSS feststellen durfte. Im Mediawiki haben viele Elemente eine ID, dennoch haben sich Selektoren wie #ID p a als hinderlich erwiesen.

Bis demnächst
Matthias

[Gunnar Bittersmann]

@@Matthias Apsel

ID-Selektoren sind „böse“

Nein.

zumindest falsch eingesetzte ids.

Fazit
»Don’t use ids in selectors« ist ein Mythos der Webentwicklung. Auf ids im CSS zu verzichten ist nicht sinnvoll. Im Gegenteil. Wer auf ids verzichtet, der beraubt sich einer großartigen Möglichkeit, die CSS genauso vorgesehen hat und die CSS ausmacht.

Meine Rede.

LLAP 🖖

[Christian Kruse]

Hallo Gunnar,

zumindest falsch eingesetzte ids.

Fazit
»Don’t use ids in selectors« ist ein Mythos der Webentwicklung. Auf ids im CSS zu verzichten ist nicht sinnvoll. Im Gegenteil. Wer auf ids verzichtet, der beraubt sich einer großartigen Möglichkeit, die CSS genauso vorgesehen hat und die CSS ausmacht.

ID-Selektoren sind dann sinnvoll, wenn man tatsächlich einen Sonderfall hat. Hat man aber selten - deshalb heisst es ja Sonderfall. ;-)

LG,
CK

[Gunnar Bittersmann]

@@Matthias Apsel

Die Fragestellung lässt darauf schließen, dass der TO recht unerfahren ist.

table class="table" 😱 In diesem Punkt hast du wohl recht.

LLAP 🖖

[dedlfix]

Tach!

Die Fragestellung lässt darauf schließen, dass der TO recht unerfahren ist.

table class="table" 😱 In diesem Punkt hast du wohl recht.

Es kann auch sein, dass er einfach nur Bootstrap verwendet.

dedlfix.

[Fahri]

table class="table" 😱 In diesem Punkt hast du wohl recht.

Ja, stimmt unerfahren, aber in diesem Fall eine Vorgabe von Bootstrap -> http://getbootstrap.com/css/#tables . Und jetzt bitte keine Diskussion ob Bootstrap ein gutes Framework ist oder nicht...

[Gunnar Bittersmann]

@@Fahri

Und jetzt bitte keine Diskussion ob Bootstrap ein gutes Framework ist oder nicht...

Nein, darüber muss man wirklich nicht diskutieren. ;-)

LLAP 🖖

[Fahri]

Hallo CK

also der Aufruf erfolgt

			#lister li:before {
				 content: "\e063";
				font-family: 'Glyphicons Halflings';
				font-size: 13px;
				float: left;
				margin-top: 4px;
				margin-left: -20px;
				color: #3498db;
			}

table class="table" id="lister"

trotzdem werden Sie nicht vor jedem Tabellen LI angezeigt. Oder würde ich es dann in jedes LI als id einfügen?

[Matthias Apsel]

Hallo Fahri,

			#lister li:before {
			}

table class="table" id="lister"

trotzdem werden Sie nicht vor jedem Tabellen LI angezeigt. Oder würde ich es dann in jedes LI als id einfügen?

Es darf nur ein Element mit der ID "lister" geben.

Bis demnächst
Matthias

[Fahri]

Hallo Matthias,

Es darf nur ein Element mit der ID "lister" geben.

dh. ich müsste es als Class aus geben?

			.lister li:before {
				 content: "\e063";
				font-family: 'Glyphicons Halflings';
				font-size: 13px;
				float: left;
				margin-top: 4px;
				margin-left: -20px;
				color: #3498db;
			}

<table class="table lister"

[MrMurphy1]

Hallo

id dürfen im body-Bereich ein Webseite nur einmal vorkommen, class beliebig oft.

Wobei alle mir bekannten Browser auch mehrfach vorkommende id problemlos anzeigen.

Solange deine CSS-Suppe ungenießbar ist spielt die Frage nach id oder class keine Rolle.

Gruss

MrMurphy

[Matthias Apsel]

Hallo Fahri,

dh. ich müsste es als Class aus geben?

Wenn es mehrere solcher Elemente auf der Seite gibt, dann ja.

Du solltest vielleicht deine Seite mit dem nu-Validator prüfen und dann MrMurphys Tipp befolgen.

Bis demnächst
Matthias

[MrMurphy1]

Hallo

Probier mal nur

#lister li:before {
   content: "\e063";
   font-family: 'Glyphicons Halflings';
}

und schau dir das Ergebnis an. Die anderen CSS-Angaben sehen mir in ihrem Zusammenspiel nicht sinnvoll aus. Die notwendigen kannst du dann nacheinander wieder einfügen.

Gruss

MrMurphy

[Tabellenkalk]

Hallo,

zeig doch mal was vom HTML-Code. Mir scheint du wirfst hier munter Tabelle und Liste durcheinander.

Gruß
Kalk