CSS-Problematik skalierbares Header-Image über bootstrap.css

Hallo,

ich habe mit dem CSS bei einem Theme ein Problem und ich hoffe ihr könnt mir helfen.

In dem Theme existiert für die Skalierung auf mobilen Geräten eine bootstrap.css, in der die header-Grafik auf max-width: 100% gesetzt wird. Das sorgt dafür, dass im Firefox und IE die Grafik so geladen wird, wie breit sie tatsächlich ist. Ihm ist also egal ob er 1000px breit ist oder 570px. Im google Chrome dagegen habe ich das Problem, dass er dort 100% immer auf 570px definiert und dementsprechend die Grafik runterskaliert - auch wenn der Platz für die volle Breite der Grafik da wäre.

Im Chrome skaliert die Seite auch auf den mobilen Geräten dann sehr gut - dafür jedoch im Firefox nicht. Und ich bin echt am verzweifeln.

Ich habe ihm jetzt erst einmal im css gesagt, dass max-width: inherit !important ist, damit der erst einmal die tatsächliche Breite anzeigt - funktioniert in Desktop-Ansicht bei allen Browsern-... bis man skaliert und das Fenster kleiner wird. Dann skaliert alles außer das image im Header - das bleibt stur auf maximale breite.

Und ich weiß nicht woran das liegen soll.

Da ich nicht genau weiß ob das tatsächlich ein css fehler ist, bitte ich um kurzes Feedback, welche Screenshots vom Code ihr benötigt um mir ggf. helfen zu können.

 

Hallo alchymyth,

Danke für deinen Willkommensgruß. Habe das Problem gefixed. Es war ein div weiter oben mit 570px !important definiert. Als ich dies überschrieben habe, skalierte die Seite wunderbar man muss nur lange genug suchen...