background-image mozilla – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self background-image mozilla Wed, 01 Aug 07 11:33:58 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151126#m1151126 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151126#m1151126 <p>div#content{<br> position: absolute;<br> width: 682px;<br> height: 459px;<br> left: 239px;<br> top: 98px;<br> background-image: url(images/bg_05.jpg);<br> background-attachment: fixed;<br> background-repeat: no-repeat;<br> overflow: auto;<br> }</p> <p>die bg-images werden im ie und ff unterschiedlich dargestellt.<br> soweit ich gelesen habe, ergibt die gleichzeitige verwendung von</p> <p>background-attachment: fixed;<br> background-repeat: no-repeat;</p> <p>diese problem. tatsächlich ergibt jedoch auch das weglassen einer der beiden attribute unterschiedliche ergebnisse.</p> <p>(die gepostete variante stellt im ie das bg-image korrekt dar und auch das scroll-verhalten ist so gewünscht)</p> <p>vielleicht hat jemand eine lösung? (-moz-background-origin: bzw. background-position: ?)</p> background-image mozilla Wed, 01 Aug 07 11:42:03 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151138#m1151138 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151138#m1151138 <p>Hi,</p> <blockquote> <p>div#content{<br> position: absolute;<br> width: 682px;<br> height: 459px;<br> left: 239px;<br> top: 98px;<br> background-image: url(images/bg_05.jpg);<br> background-attachment: fixed;<br> background-repeat: no-repeat;<br> overflow: auto;<br> }</p> <p>die bg-images werden im ie und ff unterschiedlich dargestellt.</p> </blockquote> <p>Klar. IE kann mit background-attachment:fixed nicht richtig umgehen.</p> <blockquote> <p>soweit ich gelesen habe, ergibt die gleichzeitige verwendung von<br> background-attachment: fixed;<br> background-repeat: no-repeat;<br> diese problem.</p> </blockquote> <p>Das background-repeat hat keinen Einfluß auf den Bug im IE.</p> <blockquote> <p>(die gepostete variante stellt im ie das bg-image korrekt dar und auch das scroll-verhalten ist so gewünscht)</p> </blockquote> <p>Korrekt im IE? Nein. Vielleicht "wie von Dir gewünscht".<br> Bei background-attachment:fixed bezieht sich die background-position auf den Viewport, nicht auf das Element.<br> Aber IE ist zu blöd dafür.</p> <p>cu,<br> Andreas</p> <div class="signature">-- <br> <a href="http://MudGuard.de/" rel="nofollow noopener noreferrer">Warum nennt sich Andreas hier MudGuard?</a><br> <a href="http://ostereier.andreas-waechter.de/" rel="nofollow noopener noreferrer">O o ostern ...</a><br> Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.<br> </div> background-image mozilla Wed, 01 Aug 07 13:16:58 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151127#m1151127 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151127#m1151127 <p>Hallo,</p> <blockquote> <p>die bg-images werden im ie und ff unterschiedlich dargestellt.</p> </blockquote> <p>wie MudGuard schon schrieb bezieht sich die Positionierung des Hintergrundbildes auf den Viewport (das Anzeigefensters deines Browsers) Es hängt im FF (und in anderen standardkonformen Browsern) also unsichtbar in der linken oberen Ecke des Browserfensters.</p> <p>Daraus ergibt sich auch schon der Lösungsansatz: Für alle nicht IE muss die Position des Hintergrundbildes auf</p> <blockquote> <p>div#content{<br> left: 239px;<br> top: 98px;</p> </blockquote> <p>verschoben werden. Alles klar? Es könnte zum Beispiel so aussehen:</p> <p><!--[if !IE]>--><br>   <style type="text/css"><br>     div#content {<br>       background-position:239px 98px;<br>       }<br>   </style><br> <!--<![endif]--></p> <p>Grüße,</p> <p>Jochen</p> <div class="signature">-- <br> Kritzeln statt texten:<br> <a href="http://www.electric-lemon.de/scribbleboard.php" rel="nofollow noopener noreferrer">Scribbleboard</a> </div> background-image mozilla Wed, 01 Aug 07 15:45:28 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151128#m1151128 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151128#m1151128 <p>danke für deine antwort, erklärung und den lösungsansatz..</p> <p>div#content{<br>  width: 682px;<br>  height: 459px;<br>  left: 239px;<br>  top: 98px;<br>  position: absolute;<br>  background-image: url(images/bg_05.jpg);<br>  background-attachment: fixed;<br>  background-repeat: no-repeat;<br>  overflow: auto;<br> }<br> [if !IE]<br>     div#content {<br>       background-position: 239px 98px;<br>       }<br> [endif]</p> <p>greift leider nicht.. hast du ahnung wieso?.. (css -> externe .css-datei)</p> <p>lg, m</p> background-image mozilla Wed, 01 Aug 07 17:07:23 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151129#m1151129 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151129#m1151129 <p>Hallo m.v.,</p> <blockquote> <p>[if !IE]<br>     div#content {<br>       background-position: 239px 98px;<br>       }<br> [endif]</p> </blockquote> <p>Conditional Comments funktionieren innerhalb von HTML.</p> <p>Jonathan</p> <div class="signature">-- <br> <a href="http://emmanuel.dammerer.at/selfcode.html" rel="nofollow noopener noreferrer">Selfcode:</a> <a href="http://www.peter.in-berlin.de/projekte/selfcode/?code=ie%3A%28+fl%3A%7B+br%3A%3E+va%3A%29+ls%3A%26+fo%3A%29+rl%3A%3F+ss%3A%7D+de%3A%3E+js%3A%7C+ch%3A%3F+mo%3A%7D+zu%3A%29" rel="nofollow noopener noreferrer">ie:( fl:{ br:> va:) ls:& fo:) rl:? ss:} de:> js:| ch:? mo:} zu:)</a> </div> background-image mozilla Wed, 01 Aug 07 18:09:48 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151130#m1151130 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151130#m1151130 <p>hi,</p> <p>hab ich schon versucht.. weder im "style" noch im "script" tag greift es.. weder im head bereich, noch im betreffenden <div>..<br> hm.. (ahnungsloses etwas, ich).. ^^</p> Conditional Comments Thu, 02 Aug 07 07:21:11 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151131#m1151131 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151131#m1151131 <p>Hallo,</p> <blockquote> <p>hab ich schon versucht.. weder im "style" noch im "script" tag greift es.. weder im head bereich, noch im betreffenden <div>..</p> </blockquote> <p>das *muss* funktionieren. Verwendung und Syntax ist unter <a href="http://de.selfhtml.org/css/layouts/browserweichen.htm#alternative" rel="nofollow noopener noreferrer">Conditional Comment</a> nochmal beschrieben.<br> Leider fehlt in der SELFHTML Doku ein Beispiel für !IE (nicht IE) Mit welcher IE Version testet du, und hast du etwas online zum angucken?</p> <p>Grüße,</p> <p>Jochen</p> <div class="signature">-- <br> Kritzeln statt texten:<br> <a href="http://www.electric-lemon.de/scribbleboard.php" rel="nofollow noopener noreferrer">Scribbleboard</a> </div> background-attachment, -position im IE 7 Thu, 02 Aug 07 16:02:23 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151132#m1151132 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151132#m1151132 <blockquote> <p>das *muss* funktionieren.</p> </blockquote> <p>nur nicht im IE7. Dieser wiederum verhält sich (zumindest im Standard Compliance Mode) wie der FF.</p> <p>Demnach ist die Prüfung auf !IE Käse.<br> Im CSS sollte das Hintergrundbild für einen standardkonformen Browser positioniert werden. Also background-position: left und top des Containers, und für IE 5-6 die Korrektur background-position:0px 0px;</p> <p>So etwa: <a href="http://www.electric-lemon.de/self/backgroundpos.html" rel="nofollow noopener noreferrer">http://www.electric-lemon.de/self/backgroundpos.html</a></p> <p>HTH</p> <p>Jochen</p> <p>P.S. liest du noch mit m.v. oder schon aufgegeben? oder gelöst?</p> <div class="signature">-- <br> Kritzeln statt texten:<br> <a href="http://www.electric-lemon.de/scribbleboard.php" rel="nofollow noopener noreferrer">Scribbleboard</a> </div> background-attachment, -position im IE 7 Sat, 04 Aug 07 04:14:24 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151137#m1151137 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151137#m1151137 <p>hallo,</p> <p>ich lese noch - und ich habe bisher noch keine funktionierende lösung gefunden.. etwas dumm, wenn man unter zeitdruck steht..</p> <p>ich erlaube mir einmal, dir ein mail mit gesamten code zu schicken.. ^^</p> <p>lg, m</p> background-attachment, -position im IE 7 Sat, 04 Aug 07 04:21:46 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151136#m1151136 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151136#m1151136 <p>achja.. und ich kanns mir nicht verkneifen:<br> das war mein erstes "tabellenfreies, w3c konformes layout".. (weil vom auftraggeber so erwünscht) ich könnte weinen.. schlüssigkeit durch konformität? -ein scherz..<br> meine tabellenlayouts haben immer funktioniert.. nicht genug, dass ie und ff unterschiedlich interpretieren.. wenn ich dann auch noch in "jeder" arbeit ie VERSIONEN überprüfen muss wird das ganze redlich witzlos..</p> background-attachment, -position im IE 7 Sat, 04 Aug 07 04:41:05 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151133#m1151133 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151133#m1151133 <p>ha!</p> <p><!--[if lt IE 7.0]><br> <style type="text/css"><br> div#content {<br>   background-position:0px 0px;<br>   }<br> </style><br> <![endif]--></p> <p>hat funktioniert.. zumindest in den versionen von ff und ie, die ich installiert habe.. der code is von vorn bis hinten ein ziemlicher pfusch geworden, aber es scheint zu funktionieren..</p> <p>http://www.friseurtiptop.at</p> <p>(bitte seht euch den quellcode nicht an.. ^^)</p> background-attachment, -position im IE 7 Sat, 04 Aug 07 09:18:02 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151134#m1151134 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151134#m1151134 <p>Hallo m.v.!</p> <blockquote> <p><a href="http://www.friseurtiptop.at" rel="nofollow noopener noreferrer">http://www.friseurtiptop.at</a></p> </blockquote> <p>Bitte lies mal, wie man hier <a href="http://forum.de.selfhtml.org/hilfe/bedienung.htm#verweise-einbinden" rel="nofollow noopener noreferrer">Verweise einbindet</a>...</p> <p>Also, sieht gar nicht so schlecht aus!</p> <blockquote> <p>(bitte seht euch den quellcode nicht an.. ^^)</p> </blockquote> <p>Es gibt schlimmere!</p> <p>Zwei Anmerkungen:<br> mit <?xml version="1.0" encoding="iso-8859-1"?> wird der unfähige IE 6 in den Quirksmode geschickt. Ob es so gewollt wird?</p> <p>Der Validator meldet noch <a href="http://validator.w3.org/check?uri=http%3A//www.friseurtiptop.at/" rel="nofollow noopener noreferrer">2 fehlenden, notwendigen alt-Attribute</a> bei zwei Bildern. Wenn der Grund für Dein weglassen von »alt="..."« der sein sollte, dass der IE dann ein Tooltip anzeigt, wenn man mit der Maus über dem Bild ist, dann wisse, dass es ein Fehlinterpretation des alt-Attributs durch den IE ist. Wenn Du nicht willst, dass ein Tooltip erscheint, dann notiere dazu ein leeres title-Attribut:</p> <p><img src="images/trends_02.gif" alt="irgendeine Bildbeschreibung oder angabe für Browser/Benutzer, die Bilder nicht anzeigen" title=""></p> <p>Ob du für diese zwei »Frisur-Bilder« je ein eigenes div-Element brauchst? Du kannst den Bildern direkt je eine ID verpassen und sie ganz ohne div-Element positionieren.</p> <p>Aber wenn es Deine erste tabellenlose Arbeit ist, ist es, wie gesagt, schon mal nicht schlecht. Weiter in diese Richtung!</p> <p>Viele Grüße aus Frankfurt/Main,<br> Patrick</p> <div class="signature">-- <br> <img src="http://www.atomic-eggs.com/clubsig.gif" alt="" loading="lazy"><br> _ - jenseits vom delirium - _<br> [<a href="http://www.atomic-eggs.com/" rel="nofollow noopener noreferrer">link:hatehtehpehdoppelpunktslashslashwehwehwehpunktatomicminuseggspunktcomslash</a>]<br> Nichts ist unmöglich? <a href="http://www.atomic-eggs.com/cwi/cwi_4.shtml" rel="nofollow noopener noreferrer">Doch!</a><br> Heute schon ge<a href="http://goek.atomic-eggs.com/goek_goek.html" rel="nofollow noopener noreferrer">gök</a>t? </div> background-attachment, -position im IE 7 Sun, 05 Aug 07 18:56:15 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151135#m1151135 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151135#m1151135 <p>hallo und danke für dein feedback!</p> <p>stichwirt alttext: ja.. hab ich einfach nicht daran gedacht.. (war auch was höhe und breite-angaben angeht etwas schleissig.. ^^)<br> stichwort "id" für images: wußte von der möglichkeit nichts.. vielen dank für den tip!<br> stichwort "Quirksmode": danke auf für diesen hinweis.. tag entfernt.. (ist soweit ich erlesen konnte auch ohne w3c valid)<br> stichwort verweise einbinden: auch danke für den tip.. ; )</p> <p>lg, m</p> background-image mozilla Wed, 01 Aug 07 12:29:36 Z https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151139#m1151139 https://forum.selfhtml.org/self/2007/aug/1/background-image-mozilla/1151139#m1151139 <p>und wie genau soll mir deine antwort helfen?..<br> leider bringt mir die info, dass IE einfach zu blöd ist keine lösungsansätze.. ; )</p>