Zum Inhalt springen

Seiten CSS überschreibt das eingebundene CSS nicht!?

Erstellt am 12. Juli 2012 · 4 Antworten · letzte Antwort am 14. Juli 2012

Tags: HTML & CSS, Frage

mp3fritz ·

HalloTypo3 Gemeinde,

Ich habe folgendes Problem.
Ich möchte nur auf der Startseite eine CSS-Eigenschaft ändern.
Standardmäßig wird die CSS-Datei "basemod.css" eingebunden
In dieser Datei gibt es unter Anderem eine Angabe für das Element #main

#main {padding: 10px,}

Auf der Startseite möchte ich nun aber ein Bild das den kompletten Contenntbereich ausfüllt und somit sollte für die Startseite das Element #main kein padding aufweisen.

Hierzu habe ich per TS foelgden Code eingebunden:

page.includeCSS {
 
   file1 = fileadmin/templates/css/basemod_home.css
 
}

in der basemod_home.css habe ich einfach die komplette basemod.css kopiert und nur den Wert für das padding im #main geändert.

Wenn ich die Seite nun aber im Frontend aufrufe wird immer noch das Padding aus der basemod.css angewendet. Beim Betrachten mit Firebug sehe ich, daß meine Angabe aus dem basemod_home.css nach der basemod.css angezeigt wird. Wenn ich mit Firebug die erste Angabe für das #main Element deaktiviere dann wird die Version ohne Padding angezeigt..

Was mache ich falsch, warum wird nicht das "standard CSS" überschrieben?

Bitte genbt mir nen Tipp was ich falsch mache...

Danke

mp3fritz ·

Ja das Layout basiert auf YAML.
Kann es daran liegen, daß alle CSS-Dateien über die Haupt-CSS-Datei mit der @import url.... eingebunden werden?

...
@import url(screen/basemod.css);
...
skydivematy ·

Hallo mp3fritz,
du kannst jetzt zb. das #main padding direkt in der basemod.css ändern oder Du hängst in dem Haupt-CSS einfach mit @import url(screen/mein_custom.css); mit Deinen Anpassungen über der basemod.css dazu.

Wie hast DU denn YAML eingebunden? Ganz normal also nur das YAML Projekt oder hast Du das als db_yamltv, db_ttv Extension eingebunden?

gruss
maty

Kurt51 ·

Hast Du in der basemod_home.css auch das eingetragen:

#main {padding:0 !important;}

Außerdem würde dieser Eintrag alleine in der basemod_home.css als file2 genügen!

Weiterhin könntest Du ab TYPO3 V4.7 mit verschiedenen Backendlayouts arbeiten und diese dann im body-tag als id mitgeben ( z.B. <body id="style2" ) und dann in der basemod.css am Ende schreiben:

#style2 #main {padding:0;}

Die ID im body-Tag erstellst Du so:

page.bodyTagCObject = HTML
page.bodyTagCObject.value {
   field = backend_layout
   wrap = <body id="style|">
}