CSS - Vererbung

[Matthias]

Hi zusammen,

ich möchte gern folgendes Problem lösen, ich hab eine php-Klasse, die einen Kalender aufbaut, einmal in einer sidebar und einmal im content Bereich.
Sie liefert den Kalender in Form eines Strings zurück den ich dann ausgebe.

Mein Problem:
Da ich nicht diverse Fallunterscheidungen in der Klasse haben möchte, würde ich gern anhand des ersten div-Containers festlegen welche styles geladen werden.

Wenn das erste div die id="sidebarcalendar" enthält, sollen spezielle css Klassen geladen werden, wenn die id="contentcalendar" ist, sollen andere geladen werden.

BEISPIEL: sidebarcalendar

<div id="sidebarcalendar">

<div class="headline">Januar 2008</div>

<div class="weekheadline">Mo</div>
   <div class="weekheadline">Di</div>
   ...
   <div class="weekheadline">So</div>

<div class="day">Mo</div>
   ...
   <div class="day">Fr</div>
   <div class="weekend">Sa</div>
   <div class="weekend">So</div>

</div>

BEISPIEL: contentcalendar

<div id="contentcalendar">

<div class="headline">Januar 2008</div>

<div class="weekheadline">Mo</div>
   <div class="weekheadline">Di</div>
   ...
   <div class="weekheadline">So</div>

<div class="day">Mo</div>
   ...
   <div class="day">Fr</div>
   <div class="weekend">Sa</div>
   <div class="weekend">So</div>

</div>

Wie ihr seht, möchte ich die Kindelemente (headline,weekheadline,day,weekend) gleich benennen, damit in die php Klasse möglichst nicht mehr eingegriffen werden muss...

Kann man bei css in der Form id.klasse{} "ableiten", also z.B. wenn ich

#contentcalendar.headline
{
   color:#000000;
}

#sidebarcalendar.headline
{
   color:#ffffff;
}

sage, werden dann die unterschiedlichen Styles benutzt?

Irgendwie gibt es da soviel im Netzt, dass ich aus nichts mehr richtig schlau werde...

Wäre super, wenn mir jmd nen Tipp geben könnte, ob und wie man sowas realisiert :o)

vg, matthias

[Mega]

#contentcalendar.headline

Man trennt sowas nicht per Punkt, da mit einem Punkt ein Klassenname definiert wird.

#contentcalendar headline {}

dürfte das sein was du suchst.

BTW: Eine DIV-Suppe ist nicht wirklich besser als ein Tabellenlayout.

[Matthias]

Hi Du,

genau das habe ich gesucht, danke :o)

jups, brühe bleibt brühe *gg*

nommal merci

vg, matthias

[suit]

BTW: Eine DIV-Suppe ist nicht wirklich besser als ein Tabellenlayout.

doch, eine div-suppe ist besser als ein tabellenlayout

lieber gar kein logischer zusammenhang als ein falscher ;)

[Mega]

doch, eine div-suppe ist besser als ein tabellenlayout

Ich hab wohl nur die Hälfte geschrieben von dem, was ich meinte ;)
Ein Kalender ist IMO prädestiniert für eine Tabelle. Denn es sind tabellarische Daten.

Also in _diesem_ Fall ist eine Tabelle wesentlich besser, wie ich finde.

[Cheatah]

Hi,

BTW: Eine DIV-Suppe ist nicht wirklich besser als ein Tabellenlayout.

darüber mag man streiten. Auf jeden Fall ist eine <div>-Suppe sehr, sehr viel schlechter als die Verwendung einer Tabelle für tabellarische Daten - und genau die haben wir bei der Zuordnung von Kalenderwochen zu Wochentagen vorliegen.

Cheatah

[Thomas Luethi]

Hallo,

#contentcalendar.headline
Man trennt sowas nicht per Punkt, da mit einem Punkt ein Klassenname definiert wird.
#contentcalendar headline {}
dürfte das sein was du suchst.

Naja, nenne mir bitte den HTML-Dialekt, der ein HEADLINE-Element kennt. ;-) SCNR.

Im Ernst: Um bei diesem HTML

<div id="sidebarcalendar">
   <div class="headline">Januar 2008</div>
   <!-- ... -->
</div>

das innere DIV anzusprechen, braucht Matthias den CSS-Selektor

#sidebarcalendar .headline

Der Punkt ist unbedingt notwendig, da es sich bei headline um
eine Klasse handelt. Aber es braucht einen Leerschlag davor.

Der Vollständigkeit halber noch der Link:
http://de.selfhtml.org/css/formate/zentrale.htm

BTW: Eine DIV-Suppe ist nicht wirklich besser als ein Tabellenlayout.

ACK + mfg
Thomas

[Mega]

Naja, nenne mir bitte den HTML-Dialekt, der ein HEADLINE-Element kennt. ;-) SCNR.

XML mit der passenden DTD (ich behaupte jetzt einfach mal, XML ist ein HTML-Dialekt). Und ja, ich hab den Punkt vergessen, der gehört da natürlich hin ;)

[Gunnar Bittersmann]

@@Mega:

ich behaupte jetzt einfach mal, XML ist ein HTML-Dialekt

Beweisen wirst du das aber nicht können, weil diese Behauptung falsch ist.

Live long and prosper,
Gunnar

[Mega]

Beweisen wirst du das aber nicht können, weil diese Behauptung falsch ist.

Da will ich dir gar nicht widersprechen.
Aber man könnte doch HTML als Dialekt von XML sehen, oder? enn ich jetzt nicht direkt falsch denke, kann ich per XML und ner passenden DTD ja HTML "nachbilden", bzw. XHTML ist doch praktisch XML mit ner entsprechenden DTD, wobei die Browser "zufällig" die Elemente direkt rendern können.

Wie gesagt, nur so ne Überlegung, ich lasse mich aber auch gerne vom Gegegenteil überzeugen.

[Gunnar Bittersmann]

@@Mega:

Aber man könnte doch HTML als Dialekt von XML sehen, oder?

Jetzt versuchst du’s andersrum? Nein, auch das nicht: HTML ist zwar SGML, aber kein XML.

[w]enn ich jetzt nicht direkt falsch denke, kann ich per XML und ner passenden DTD ja HTML "nachbilden"

Ja. Das nennt sich XHTML 1.0 ...

bzw. XHTML ist doch praktisch XML mit ner entsprechenden DTD

... du sagst es.

Live long and prosper,
Gunnar

[Mega]

Jetzt versuchst du’s andersrum? Nein, auch das nicht: HTML ist zwar SGML, aber kein XML.

Nein, ich fragte nach, weils mich interessiert und ich es nicht weiss ;)

Danke für deine Ausführungen. Ich muss zugeben, in den Jahren, mit denen ich mit HTML und XML arbeite, haben ich mir darüber noch nie Gedanken gemacht.

[Cheatah]

Hi,

Wenn das erste div die id="sidebarcalendar" enthält, sollen spezielle css Klassen geladen werden,

schade, sowas gibt's nämlich nicht. Du meinst vermutlich CSS-_Regeln_, die sich (evtl.) vorhandener _HTML_-Klassen bedienen. Darüber hinaus ist "geladen" vermutlich ebenfalls nicht richtig, versuche es mit "genutzt".

Kann man bei css in der Form id.klasse{} "ableiten", also z.B. wenn ich

"Ableiten" und "vererben" sind schon wieder die falschen Begriffe. CSS kennt zwar Vererbung, aber die hat hiermit nichts zu tun. Was Du meinst ist ein Selektor, entsprechend bietet sich das Verb "selektieren" an. Und ja, das geht - außer im IE bis einschließlich Version 6. Dieser reagiert wie folgt:

#contentcalendar.headline [...]

Dies wird angewendet,

#sidebarcalendar.headline [...]

dies nicht. Grund: Die Kombination eines ID- und eines Klassenselektors im selben Simple Selector akzeptiert der IE pro Stylesheet nur ein Mal. Weiß der Geier warum.

Im Grunde ist das aber auch egal, denn Du hast kein Element, welches sowohl eine der obigen IDs als auch die Klasse "headline" besitzt. Tipp: Mit dem Nachfahrenselektor hat der IE weit weniger Probleme.

Cheatah

[Gunnar Bittersmann]

@@Matthias:

<div class="headline">Januar 2008</div>

"ich möchte eine überschrift sein, bitte bitte lass mich ein <hX> sein!" [wahsaga]

Wie konnte Cheatah das nur übersehen haben? ;-)

Live long and prosper,
Gunnar