Bildzoom mit Firefox -> unerwünschter Bildrand
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
alter falscher treiber
beispiel
bild
browser
code
dank
forum
http
idee
internet
opus
problem
rand
sprung
tag
test
testen
url
verkleinern
vermutung
-
Hallo,
ich arbeiten gerade an einem Projekt, wo ein tag/bild">Bild über die gesamte Breite eines DIV-Containers gehen soll. Das war mit CSS auch kein Problem. Ich habe den CSS-Tag zum Testen vorläufig im XHTML-Kontext integriert (<img src="xy.png" style="width:730px;">). Da die einzusetzenden Bilder in etwa mit einer Abweichung von vielleicht 10 Pixeln von den 730 Pixeln auch immer passen, ist das gestreckte oder gezerrte Bild trotzdem gut lesbar.
Aber das Bild hat mit Firefox 3.5 auf Ubuntu (sicher auch Windows) immer einen Teilrand. (Internet Explorer kann ich gerade nicht testen) Wenn ich mit dem browserinternen Zoom wegzoome, verschiebt sich der Rand auch manchmal leicht. Beim Ranzoomen verschwindet der Rand allerdings.
Ich habe es mal mit Opera getestet und da ist kein Rand zu erkenne, egal wie ich zoome.
Habt ihr eine Lösung für mich, wie ich diesen Rand wegbekomme? "border:0px;" habe ich auch schon versucht. Der Validator zeigt keine Fehler in CSS oder XHTML.
In Hoffen auf einen guten Tipp, FloRic =) -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Du hast dein Problem zwar schön lang und breit erklärt, ich versteh es aber trotzdem irgendwie nicht ganz (und andere offensichtlich auch nicht, was man an der regen Beteiligung an der Lösung erkennen kann).
Kurz gesagt: könntest du uns mal einfach einen Link zu dieser Seite posten? Das würde die Lösungsfindung wesentlich vereinfachen... -
Ich hatte heute dann noch in einem anderen Forum gefragt. Dort wurden mir plausible Lösungen angeboten, aber ich habe trotzdem noch nicht die ideale Lösung.
Einen Link poste ich wegen dem derzeitigen Inhalt (noch nicht urheberrechtlich abgesichert :) ) nicht so gern, aber in php.de habe ich mein Problem noch mal erklärt.
http://www.php.de/html-usability-und-barrierefreiheit/65417-browser-zoom-ungewollter-rand-bildern-bei-firefox.html
Vielleicht habt ihr ja eine Idee, aber wenn nicht, ist es auch nicht änderbar.
Gruß, FloRic -
Wirklich sehr hilfreiche Kommentare in diesem Forum - vor allem der Post von "Mister Ad" gefällt mir ganz besonders
.
Also bei mir entsteht beim Zoomen eines Bildes kein Rand... Hier ein Beispielcode, den du ruhig mal ausprobieren kannst (die Originalmaße des von mir verwendeten Bildes sind 130x98px):
<html> <head> <style type='text/css'> <!-- body { background: #222222; } .bild1 { width: 300px; } .bild2 { width: 100px; } --></style> </head> <body> <img class="bild1" src="http://kaetzle7.lima-city.de/bilder/kl(2).jpg" alt="Bild groß"> <img class="bild2" src="http://kaetzle7.lima-city.de/bilder/kl(2).jpg" alt="Bild klein"> </body> </html>
Jetzt sag mir, was du anders machst, möchtest oder ob ich dich völlig falsch verstehe. Ansonsten poste deinen Code, liefere uns mehr Infos, oder niemand kann dir helfen... -
Danke für deine Idee.
Ich habe mich nochmal damit beschäftigt. Du hast in Deinem Beispiel ein kleineres Bild gewählt.
Bei mir sind die Bilder in der Regel ein bisschen größer als 730 Pixel breit. Und wenn man das Bild verkleinert, entsteht der Rand.
Ich habe mal ein Beispiel mit kleinen und großen Bildern als JPG und PNG getestet. Oben erst Groß und PNG, dann JPG. Dann unten klein PNG, dann JPG.
Bei den kleinen Bildern entsteht nur bei extremen Zoomen ein Rand, was für mich aber unwichtig wäre, da bei normalen 100% kein Rand da ist. Im Gegensatz dazu haben die großen Bilder, die verkleinert wurden, immer diesen Rand, wenn man 100% hat oder noch wegzoomt.
Beispiel:
http://www.kaenguru-sprung.tk/test/test.html
Da könnt ihr ja mal hin- und herzoomen. Das ist halt genau mein Problem.
Habt ihr jetzt noch eine Idee, wie man den Rand beim Verkleinern eines Bildes auf eine feste Breite verhindert?
Leider ist das Problem nur bei Firefox. (IExe kann ich leider nicht testen, aber bei Opera gings prima)
Gruß, FloRic -
Ich sehe in deinem Beispiel keinen Rand, weder mit noch ohne Zoomen (habe Firefox 3.6) - kannst du mal einen Screenshot einfügen?
Hier noch der selbe Beispielcode, mit einem wesentlich größeren Bild: http://kaetzle7.lima-city.de/zeugs/floric.htm -
Hallo,
ich verwende noch die 3.5.8er Version von Firefox, da Ubuntu (Linux) das Update noch nicht offiziell integriert hat.
Screenshot:
http://www.kaenguru-sprung.tk/test/screenshot.png
So sehe ich das bei exakt 100% Normalzoom. Man erkennt bei den oberen den grauen, unerwünschten Rand.
Die Frage ist, ob das nun an meinem Browser liegt oder woran auch immer. Wenn ich der Einzige wäre, wäre es ja nicht so schlimm, aber doof wäre es halt, wenn dieses Problem alle auf der Seite haben würden.
Gruß, FloRic -
Also am Browser liegt das sicher nicht. Ich habe den FF 3.5.8 zu hause auf meinem Vista-PC - und sehe keine Ränder. Beim XP habe ich sogar noch den FF 3.5.7 - auch keine Ränder. Das wäre ja auch seltsam, denn viele verkleinern ihre Bilder via HTML (was man eigentlich nicht sollte, aber in deinem Fall keine große Rolle spielt) und somit wäre dieses "Problem" weit verbreitet - ist es aber nicht.
Ich kann nur Vermutungen anstellen - evtl. liegt es an...
- einem Bug in deiner Grafikkarte (alter/falscher Treiber)
- der Kombination Ubuntu/FF (kann ich mir aber fast nicht vorstellen und konnte ich leider nicht testen - Virtualbox stellt irgendwie grad keine Verbindung zum Internet her)
Wie gesagt, nur Vermutungen, für deren Richtigkeit bzw. Plausibilität ich keine Garantie abgeben kann. Aber irgendwie habe ich sowieso das Gefühl, dass du wirklich der Einzige bist, der diese Ränder sieht - also alles halb so schlimm...
-
Danke für deine Bemühungen!
Ich habe jetzt ein bisschen umständlich Firefox aktualisiert auf 3.6. Jetzt ist es ganz normal...
Ich weiß zwar nicht, woran es gelegen hat, aber auf jeden Fall klappt es jetzt.
Danke, FloRic -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
