Hallo Forum! Ich habe eine kurze Frage. Und zwar habe ich für ein paar kleine Änderungen am Template ein eigenes Theme angeleget, abgeleitet von Responsive. Änderungen an anderen Stelle funktionieren einwandfrei. Nun will ich im Warenkorb die Tabelle etwas anpassen und habe daher die cart.less angepasst. Leider werden diese Änderungen aber direkt wieder überschrieben. Hier meine cart.less: .table--media-outer { .border-radius(2px); .unitize-max-width(130, 16); .unitize-max-height(130, 16); border: 1px none @border-color; margin: 0 auto; } @media screen and (min-width: @desktopViewportWidth) { .column--product { width: 55%; .column--image { width: 25%; } .table--content { width: 75%; } } } @media screen and (min-width: @phoneLandscapeViewportWidth) { .column--product .column--image { width: 25%; } }
Die Datei ist in die eigene all.less einmgebunden und das Theme fehlerfrei kompiliert. Wenn ich im Browser das Element untersuche finde ich meine geänderten Anweisungen aber nicht bzw. es sieht so aus, als wenn diese direkt wieder überschrieben werden: [quote].product–table .table–media .table–media-outer { border-radius: 2px; background-clip: padding-box; max-width: 4.375rem; max-height: 4.375rem; border: 1px solid #DADAE5; margin: 0px auto; } .table–media-outer { border-radius: 2px; background-clip: padding-box; max-width: 8.125rem; max-height: 8.125rem; border: 1px none #DADAE5; margin: 0px auto; }[/quote] Kann mir jemand einen Tipp geben, was ich anders machen muss oder wo der Fehler liegt? Ziel ist es, die Produktbilder etwas größer zu bekommen und ohne Border. Besten Dank Lars
Je genauer der selektor ist, desto höher ist seine Priorität. Das heißt, dass „.selektor2 .selektor1“ höher priorisiert wird als nur „.selektor1“. Zusätzlich zählt die Reihenfolge - welche Anweisung steht „unten“ und überschreibt ältere Anweisungen. Alternativ kannst du auch !important verwenden. Viele Grüße