CSS unterschiedlich zwischen FF und IE? (border-style)
hawkmaster
- css
Hallo zusammen,
auf einer Seite sind diverse Input Felder:
<input class='background' name="submit" type="submit" id="submit" value="Änderungen speichern" />
<input class='background' name="Field6" type="text" id="Field6" value="7" size="50" />
Die CSS für die Klasse "background":
input.background, textarea { background-color: #F5F5F5; font-size: 8pt; border-style: solid; border-width: 1px; }
Der IE7 macht um jedes Input Feld einen dünnen Rahmen wie es sein soll.
Der FF 2 ignoriert dies, d.h. kein Rahmen.
Was ist nun richtig bzw. stimmt etwas an den Angaben nicht?
vielen Dank und viele Grüße
hawk
border: 10px solid red;
in einem separaten File testen, damit solltest du einen dicken roten Rahmen bekommen - ich kenne den rest deinens quelltexts nicht - eine Beispielseite wäre toll
tipp: mach keine klassen mit dem namen "background" "red" "rightbox" oder sonstwas ;)
Hallo,
vielen Dank für die Hilfe.
also wenn ich in der externen CSS Datei "border: 1px solid" verwende,
input.testborder { background-color: #F5F5F5; font-size: 8pt; border: 1px solid; }
dann zeigt mir sowohl der IE als auch der FF einen dünnen Rahmen um die Inputs an.
Wenn ich aber wie bisher mit "border-style" arbeite wirkt es sich NICHT im FF aus. Nur der IE kann mit beidem.:
input.background { background-color: #F5F5F5; font-size: 8pt; border-style: solid; border-width: 1px; }
Wenn ich es richtig gelesen habe, soll man doch aber border-style und "border-width" verwenden oder?
vielen Dank und viele Grüße
hawk
Wenn ich es richtig gelesen habe, soll man doch aber border-style und "border-width" verwenden oder?
nein, es ist völlig egal ob du border: 1px solid black; oder
border-width: 1px;
border-style: solid;
border-color: black;
es ist unerheblich was man verwendet
btw: .testborder ist auch kein guter klassenname :D
mach folgedes:
validiere den quelltext (sowohl html alsauch css)
wenn beides 100%ig valide ist, kannst du dich um den rest kümmern
definiere für ALLE input elemente den rahmen
input {
border: 1px solid #FF0000;
}
dann definiere die ausnahmen, alle inputs die NICHT so aussehen sollen - checkboxen zb
wichtig ist, dass die selektoren mit den tatsächlichen attributswerten übereinstimmen
wenn du <input class="MeineKlasse" /> schreibst und im css .meineklasse ansprichst, funktioniert das im internet explorer (falsch) aber nicht im firefox (richtig)
darum -> validieren
sollts dann immer noch nicht klappen: beispielseite MIT dem fehler online stellen
input.checkbox {
border: none;
}
zwar wäre es mit css möglich alle inputs mit type="checkbox" anzusprechen, aber das kann der ie nicht - darum eine klasse "checkbox"
Hi,
Wenn ich es richtig gelesen habe, soll man doch aber border-style und "border-width" verwenden oder?
nein, es ist völlig egal ob du border: 1px solid black; oder
border-width: 1px;
border-style: solid;
border-color: black;
Aber er setzt ja nicht border: 1px solid black; ein, sondern nur border: 1px solid; - und das ist ein Unterschied zur Verwendung der beiden einzelnen Eigenschaften, weil border drei Eigenschaften setzt.
cu,
Andreas
Aber er setzt ja nicht border: 1px solid black; ein, sondern nur border: 1px solid; - und das ist ein Unterschied zur Verwendung der beiden einzelnen Eigenschaften, weil border drei Eigenschaften setzt.
da hast du natürlich recht - wenn aber alle drei werte angegeben werden, gibt es defintiv keinen unterschied ;)
Hi,
Hallo,
input.testborder { background-color: #F5F5F5; font-size: 8pt; border: 1px solid; }
border: 1px solid; setzt auch die Farbe der border (auf den Default-Wert, also auf den Wert, den color hat).
input.background { background-color: #F5F5F5; font-size: 8pt; border-style: solid; border-width: 1px; }
border-style: solid; border-width: 1px; setzt _nicht_ die Farbe der border.
Hast Du irgendwo noch eine Angabe zu border-color gemacht? Wird dort die border-color auf transparent gesetzt oder auf eine Farbe, die sich für die inputs nicht vom Hintergrund unterscheidet?
cu,
Andreas
Hallo ihr Helfer,
genau das war das Problem.
Ich hatte bei der Angabe mit "border-style: solid; border-width: 1px;"
die border-color Farbe vergessen.
Jetzt klappt es auch damit. :-)
vielen Dank nochmals an alle für die Hilfe.
Gruss
hawk