Hallo zusammen,
Es scheint, als wäre ich in Protostar bei den klassischen Schaltflächen (.btn) auf ein Problem gestoßen. Hier mal der Code-Block aus dem aktuellen Original-Stylesheet:
.btn {
display: inline-block;
*display: inline;
*zoom: 1;
padding: 4px 12px;
margin-bottom: 0;
font-size: 13px;
line-height: 18px;
text-align: center;
vertical-align: middle;
cursor: pointer;
color: #333;
text-shadow: 0 1px 1px rgba(255,255,255,0.75);
background-color: #f5f5f5;
background-image: -moz-linear-gradient(top,#fff,#e6e6e6);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#e6e6e6));
background-image: -webkit-linear-gradient(top,#fff,#e6e6e6);
background-image: -o-linear-gradient(top,#fff,#e6e6e6);
background-image: linear-gradient(to bottom,#fff,#e6e6e6);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe5e5e5', GradientType=0);
border-color: #e6e6e6 #e6e6e6 #bfbfbf;
*background-color: #e6e6e6;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
border: 1px solid #bbb;
*border: 0;
border-bottom-color: #a2a2a2;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
*margin-left: .3em;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
}
Alles anzeigen
Was mich etwas stutzig macht, sind diese vier Zeilen, die mit dem Rahmen der Schaltfläche zu tun haben:
border-color: #e6e6e6 #e6e6e6 #bfbfbf;
border: 1px solid #bbb;
*border: 0;
border-bottom-color: #a2a2a2;
Jetzt ignoriert Firefox (laut "Inspektor") offenbar border-color: #e6e6e6 #e6e6e6 #bfbfbf;, weil border: 1px solid #bbb; und border-bottom-color: #a2a2a2; gesetzt sind. Das sieht bei mir derzeit so aus (ohne text-decoration: underline;) :
Schalte ich nun border: 1px solid #bbb; aus und setze border-style: solid; und border-width: 1px;, wird border-color: #e6e6e6 #e6e6e6 #bfbfbf; im Firefox brav verarbeitet:
Auch die Regeln für Überschriften sind seltsam. Zuvor definierte Schriftgrößen für h1 bis h6 werden weiter unten wieder überschrieben. Da läuft doch viel redundant ab, oder macht das tatsächlich Sinn? (Ich bin jetzt nicht so der tolle CSS-Experte...)
Liebe Grüße, Gerry77