CSS - Browser Hacks

[x4all]

Hallo zusammen, seit contao 2.10 sind Browserweichen zu unterschiedlichen CSS-Dateien ja nicht mehr notwendig (http://www.contao.org/de/news/verges...ontao-210.html.

Ich habe das bei mir so eingefügt, da der IE8 bei mir die link-klasse a.button nicht korrekt anzeigt.

Meine CSS Definition lautet:

normal: button, a.button

Speziell für den IE8: .ie8 button, .ie8 a.button

Aber die Anweisung in meinem CSS Selektor greift nicht. Browsercache habe ich geleert und Systemwartung durchgeführt...

Mach ich was falsch?

Grüße
X4all

[Freeflow]

Wenn das so in Deiner css steht:
".ie8 button, .ie8 a.button", dann geht das nicht, weil der Punkt vor 'button' fehlt. Deshalb wird die Anweisung wohl ignoriert.
Ich gehe mal davon aus, dass 'button' eine css-Klasse sein soll.

[tblumrich]

Meine CSS Definition lautet:

normal: button, a.button

Speziell für den IE8: .ie8 button, .ie8 a.button

1. Was ist bzw. wo hast du "button" definiert?
2. Wenn das eine Klasse ist fehlt beim ersten Teil der Punkt
3. Kann man das irgendwo sehen oder kannst du uns mal etwas Code (Ausgabe HTMl, CSS) anbieten?

Gruß
Thomas

Edit: Zu spät

[x4all]

Hi, sehen kann man das gerade noch nicht, sonst häte ich es schon gepostet :-)

Habe den Punkt wohl übersehen, aber auch mit . (Punkt) greift die ganze Geschichte nicht... Rein vom Prinzip her passts doch^^


EDIT:
Hier etwas code:

<a class="button" title="Öffnungszeiten" href="kontakt.html">Öffnungszeiten</a>

Das hier ist aus der CSS vom IE8 (Developertools)
A.button {
PADDING-LEFT: 16px; PADDING-RIGHT: 16px; FONT-SIZE: 1.1em
}
BUTTON {
BACKGROUND-IMAGE: url(../../tl_files/button.jpg); BORDER-BOTTOM: #aeaeae 1px solid; BORDER-LEFT: #aeaeae 1px solid; PADDING-BOTTOM: 0.3em; LINE-HEIGHT: 1.5em; MARGIN-TOP: 1em; PADDING-LEFT: 22px; PADDING-RIGHT: 22px; BACKGROUND-REPEAT: repeat-x; BORDER-TOP: #aeaeae 1px solid; FONT-WEIGHT: normal; BORDER-RIGHT: #aeaeae 1px solid; TEXT-DECORATION: none; PADDING-TOP: 0.3em; BEHAVIOR: url(plugins/css3pie/PIE.htc); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px
}
A.button {
BACKGROUND-IMAGE: url(../../tl_files/button.jpg); BORDER-BOTTOM: #aeaeae 1px solid; BORDER-LEFT: #aeaeae 1px solid; PADDING-BOTTOM: 0.3em; LINE-HEIGHT: 1.5em; MARGIN-TOP: 1em; PADDING-LEFT: 22px; PADDING-RIGHT: 22px; BACKGROUND-REPEAT: repeat-x; BORDER-TOP: #aeaeae 1px solid; FONT-WEIGHT: normal; BORDER-RIGHT: #aeaeae 1px solid; TEXT-DECORATION: none; PADDING-TOP: 0.3em; BEHAVIOR: url(plugins/css3pie/PIE.htc); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px
}
.ie8 .button {
BACKGROUND-IMAGE: url(../../tl_files/button.jpg); BORDER-BOTTOM: #aeaeae 1px solid; BORDER-LEFT: #aeaeae 1px solid; PADDING-BOTTOM: 0.3em; LINE-HEIGHT: 1.5em; MARGIN-TOP: 1em; PADDING-LEFT: 22px; PADDING-RIGHT: 22px; BACKGROUND-REPEAT: repeat-x; BORDER-TOP: #aeaeae 1px solid; FONT-WEIGHT: normal; BORDER-RIGHT: #aeaeae 1px solid; TEXT-DECORATION: none; PADDING-TOP: 0.3em
}
.ie8 A.button {
BACKGROUND-IMAGE: url(../../tl_files/button.jpg); BORDER-BOTTOM: #aeaeae 1px solid; BORDER-LEFT: #aeaeae 1px solid; PADDING-BOTTOM: 0.3em; LINE-HEIGHT: 1.5em; MARGIN-TOP: 1em; PADDING-LEFT: 22px; PADDING-RIGHT: 22px; BACKGROUND-REPEAT: repeat-x; BORDER-TOP: #aeaeae 1px solid; FONT-WEIGHT: normal; BORDER-RIGHT: #aeaeae 1px solid; TEXT-DECORATION: none; PADDING-TOP: 0.3em
}
A.button:hover {
BACKGROUND-IMAGE: url(../../tl_files/button-hover.jpg); BACKGROUND-COLOR: #ffffff; BACKGROUND-REPEAT: repeat-x
}
A.button:active {
POSITION: relative; TOP: 1px; TEXT-DECORATION: underline
}

Grüße
X4all

[Freeflow]

Werden die CSS-Anweisungen eigentlich in allen Browsern ignoriert, oder nur im IE 8?

Mir fällt auf, dass vor 'BUTTON' immer noch der Punkt fehlt.

Dann verwendest Du die 'behavior' Anweisung für nicht IE Browser.
Aber, soweit ich mich erinnere, wird das nur vom IE unterstützt.
Außerdem können Firefox, Opera, Safari u.a. mit 'border-radius' ja was anfangen.

Und ich frage mich, ob Du die bottom-Klasse noch für was anderes außer dem a-tag verwendest.
Selbst wenn, die Anweisungen sind doppelt vorhanden.

Vielleicht helfen diese Überlegungen ja weiter.