Formatierung Widgetinfo

[Jaccolino]

Da ich einfach nicht weiter komme, vielleicht hat schon mal jemand ähnliches versucht oder hat eine Idee dazu. Ich möchte den Style des Widgetinfo verändern, da mir die Anzeige im allgemeinen zu gross ist und ich möchte die Anzeige an den unteren Rand im pagejump bringen.
Dazu habe ich in der custom.css des von mir genutzten Designs metal folgenden Eintrag gemacht:

.custom_navbar .pagejump .info {
font-size: 0.4em;
min-width: 10px;
border-radius: 10px:
background-color: #FFF;
background-image: none;
color: red;
height: 10px;
padding: 0 0.3em;
min-height: 0;
text-shadow: none;
}

Der Eintrag bewirkt eigenartiger Weise keine Veränderung. Nur auf dem IPad ändert sich die Schriftfarbe gelegentlich auf rot.
Auf dem Mac ist weder eine Veränderung im Safari, noch im Firefox zu sehen. Cache wurde geleert und zwischenzeitlich auch für einen Tag vollkommen deaktiviert.

Vielleicht hat jemand eine Idee dazu, ich bin für jeden Vorschlag dankbar.

[peuter]

Der normale Pfad wäre auch

.navbar .pagejump .info {
...
}

schonmal damit probiert?

[Jaccolino]

Da war das Brett vor dem Kopf. Ich hatte ja einen Eintrag in der css verändert und nicht dazugesetzt. Alles klar. Danke für die schnelle Hilfe. Jetzt funzt es wunderbar.

[Tqm]

Hmm, bei mir bringt dieser Code in der custom.css des Designs leider keine Änderung ... Ideen? - DANKE

[B].navbar.pagejump.info [/B]{

[B] font-size[/B]:[B] 0.4em[/B];

[B] min-width[/B]:[B] 10px[/B];

[B] border-radius[/B]:[B] 10px[/B]:

[B] background-color[/B]:[B] transparent[/B];

[B] background-image[/B]:[B] none[/B];

[B] color[/B]:[B] red[/B];

[B] height[/B]:[B] 10px[/B];

[B] padding[/B]:[B] 0 0.3em[/B];

[B] min-height[/B]:[B] 0[/B];

[B] text-shadow[/B]:[B] none[/B];

}

[peuter]

Da fehlen auch die Lehrstellen im CSS-Selektor. .navbar .pagejump .info

[Tqm]

Die habe ich mal versuchsweise rausgenommen weil es nicht funktioniert hat, mit oder ohne Lehrstellen - keine Änderung

[peuter]

Also ohne kann es nicht gehen und wenn es mit nicht geht müsstest Du mal prüfen ob der Browser die Änderungen auch wirklich geladen hat oder noch die alte custom.css aus dem Cache benutzt. Das geht wohl am einfachsten in der Developer Console des Browsers hier am am Beispiel Chrome beschrieben: Öffnen mit F12, auf Sources klicken und dann in der Linken Baumansicht bis zur gewünschten custom.css durchklicken und dann siehst Du was drin steht. Fehlen da die Änderungen => Browser Cache leeren.

[Tqm]

Also richtig geladen wird es ... CometVisu-Client2.jpg

[peuter]

Ok, dann liegt es daran, dass die CSS-Regeln im Design an der gewünschten Stelle spezifischer sind, und somit gegen Deine Änderung "gewinnen". Um das zu übersteuern, musst Du den einzelnen Regeln ein "!important" hinzufügen. Also z.B. so

.navbar .pagejump .info {
    font-size: 0.4em !important;
    min-width: 10px !important;
    border-radius: 10px !important;
    background-color: transparent !important;
    background-image: none !important;
    color: red !important;
    height: 10px !important;
    padding: 0 0.3em !important;
    min-height: 0 !important;
    text-shadow: none !important;
}

[Tqm]

PERFEKT ! Danke!!