CSS Stylesheet für nur ein Element trotz gleicher Klasse

[noodlesoup_123]

Hallo liebe Community,

Ich benutze version 4.9.2

Ich habe ein Stylesheet für eine Klasse ce_text.block erstellt und wollte damit
gerne nur ein bestimmten Text auf einer Seite gestalten.
Ich hatte zunächst das Problem, dass alle möglichen Texte mit der klasse auf der Website dann dieses
Stylesheet hatten, was ich nicht wollte. Ich habe dann das Seitenlayout von meinem Theme kopiert und nur
diesem den Stylesheet zugewiesen und dann auch bei der Seitenstruktur auf der Seite, wo mein Text drauf war,
dieses kopierte Layout zugewiesen.

Das klappt eigentlich sehr gut nur ist der Stylesheet auch im text bei meinem Footer aktiv
und das ist ziemlich miese briese. Kann ich dem Text im Footer eine andere Klasse zuweisen, so dass
er sich von meinem text-Stylesheet nicht mehr angesprochen fühlt?

[dazzle89]

Am besten wäre ein Link zur Seite, dann kann man dir nämlich so genau wie möglich helfen.

Es gibt aber viele Möglichkeiten, um nur einen bestimmten Text und nicht alle anzusprechen:

1. dem Body über die Seiteneinstellungen eine Klasse geben und diese im Selektor ansprechen, also z.B. "body.neue_klasse .ce_text.block"
2. dem Text eine CSS-Klasse geben und diese ansprechen: ".ce_text.block.neue_klasse"
3. ein beliebiges anderes Elternelement auf der Seite verwenden, wie z.B. "#main .ce_text.block"

Wahrscheinlich wirst du jeweils ".block" weglassen können, ".ce_text" dürfte reichen.

Bei Nummer 1 wirst du alle Textelemente ansprechen, die sich auf der entsprechenden Seite befinden.
Bei Nummer 2 bist du auf der sichersten Seite, da es nur auf ein spezielles Textelement zutrifft.
Bei Nummer 3 wirkt sich das CSS auf alle Texte innerhalb des Elternelements aus.

[tab]

Also wenn du nur auf ein einzigens oder nur auf ein Teil der ce_text-Elemente spezielle Styles anwenden willst, dann würde ich diesen Elementen eine CSS-Klasse zuweisen (Experteneinstellungen im Backend bei den betrroffenen Elementen) und dann über diese Klasse stylen. Deswegen ein zusätzliches Seitenlayout ist m.E. ein wenig viel der Ehre.

[noodlesoup_123]

A[*]dem Text eine CSS-Klasse geben und diese ansprechen: ".ce_text.block.neue_klasse"

Das habe ich auch versucht. Ich habe unter den Einstellungen des Textelements die CSS Klasse "servermanagement_text01"
angegeben und im Stylesheet dann ".ce_text.servermanagement_text01" angesprochen allerdings fühlt sich der Text im Footer immernoch
vom Stylesheet angesprochen.

Hier mal die Seite:
---------------------------------

Ich bin neu auf dem Gebiet Contao und allgemein HTML und CSS, daher bin ich da sehr überfragt.

LG danke für die schnellen Rückmeldungen.

[dazzle89]

Nach wie vor sprichst du alle Texte an, und zwar so:

.ce_text.block {
    padding-right: 35rem;
    padding-bottom: 5rem;
    padding-left: 5rem;
    background-color: #d1ccc7;
    font-size: 20px;
}

Das müsstest du nochmal prüfen und .ce_text.servermanagement_text01 draus machen.

[stefan-at-work]

Du hast aber dem Element eine CSS-ID zugewiesen und keine Klasse

[Kahmoon]

lass doch das .ce_text weg und nimm nur die Klasse servermanagement_text01 im Inhaltselement

Im CSS dann .servermanagement_text01{deine Anweisungen}

[noodlesoup_123]

Bei mir tut sich überahupt nichts :/

Ich hab das neue Layout wieder gelöscht und alles zurück auf "Mainlayout" gemacht.
Ich hab den Stylesheet Selektor auf servermanagement_text01 gesetzt, ich hab dem Text die Klasse
gegeben, dem Artikel auch. Alles einzeln ausprobiert. Ich hab den Stylesheet sogar kurz deaktiviert um zu schauen ob sich überhaupt noch was tut aber
die Website bleibt unverändert. Der Stylesheet, den ich erstellt habe, gestaltet immernoch den text und ungewollt den Footer,
obwohl ich es sogar deaktiviert habe.

LG

[dazzle89]

Wenn sich auf der Seite nichts ändert, klingt es für mich immer nach einem Cache-Problem. Kann es sein, dass du den internen CSS-Editor benutzt? Mit dem kenne ich mich kaum aus. Vielleicht hilft es, wenn du den Cache in der Systemwartung erneuerst.

Die Klasse gibst du am besten nur dem Text und nicht zusätzlich dem Artikel. Es gibt keinen Grund, die Klasse doppelt zu vergeben.

[noodlesoup_123]

Jap ich benutze den internen CSS-Editor, weil ich mich wie gesagt zu wenig mit CSS usw auskenne um soetwas selbst zu schreiben.
Ich verstehe zwar meistens was in den Codes vor sich geht aber das reicht nicht.

Vielen dank für den Tipp! wie erneuere ich das Cache denn?

[dazzle89]

Menü -> Systemwartung -> Haken bei Skriptcache leeren setzen -> Daten bereinigen

Ist aber nur geraten, ob es daran liegt

[noodlesoup_123]

Es hat tatsächlich funktioniert!!!

Jetzt ist es so wie ich es mir gedacht habe. Und ich habe mich schon immer gewundert, was
ich denn falsch mache, wenn ich etwas eine Klasse geben will und es nie geklappt hat.

Vielen dank!!!

[Kahmoon]

Den internen CSS Editor würde ich aber nicht mehr verwenden. Mittelfristig verschwindet der (wenn ich mich richtig erinnere)

[designpilot]

Ja das ist richtig Kahmoon der interne CSS Editor wird mittelfristig wegfallen.

Ich bin auch nicht unbedingt der CSS Hirsch, ich lese aber viel (auf allen möglichen Seiten) und es macht echt Spass sich in die Materie einzuarbeiten.

Tipp: kaufe doch das neue HTML/CSS Buch von Peter Müller das ist echt gut um HTML/CSS zu lernen.


Gesendet von iPhone mit Tapatalk Pro