kostenloser Webspace werbefrei: lima-city


WP Design für IE anpassen

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. pflanzenfreund

    Kostenloser Webspace von pflanzenfreund, auf Homepage erstellen warten

    pflanzenfreund hat kostenlosen Webspace.

    Hi, Biolauri ! Danke für die Erläuterungen. Der Threaderstellerin ist damit leider nicht gedient. Aber der Hinweis auf "Opacity" scheint mir sinnvoll. Beim Lesen der Teile, die ich laden konnte, dachte ich auch mal kurz darüber nach. Ansonsten geht es mir da wir Dir : Komplett laden läßt sich das nicht. Wahrscheinlich irgendwo Verzeichnisschutz. Ist ja im Normalfall auch sinnvoll.
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    biolauri schrieb:
    ... Abhilfe könnte man hier durch absolutes Adressieren schaffen. Dabei - wie bei HTML einfach mit einem "/" anfangen und so ab dem HTML-Root referenzieren. Allerdings müsste man dazu sehr wahrscheinlich das ganze WP-Theme ändern...

    Vielleicht ist auch die Opacity-Regel in CSS für den IE schwer verständlich. Vielleicht die einfach mal weg lassen und schauen, obs der IE besser anzeigt. Ich kann das leider bei mir nicht testen, da es irgendwelche Komplikationen beim herunterladen der kompletten Seite gibt. Tut mir Leid.

    Dank dir!
    Das ganze Theme ändern "nur" damit der IE das anzeigt möchte ich nicht (und schaffe ich vermutlich auch nicht).

    Wegen der Opacity-Regel im CSS die war vorher auch schon da für die drei Elemente; RSS,FB,T und ich habe sie erst später den anderen Elemente zugefügt, sprich anfangs und da erschien im IE auch schon kein Bild war es garnicht definiert. Das hatte ich selbst schon als Fehlerquelle vermute und es deswegen anfangs gelassen, als ich dann bemerkte das es bei IE keinen Unterschied macht und im FF ein bisschen besser aussieht habe ich es erst hinzugefügt/gelassen.

    pflanzenfreund schrieb:
    Hi, Biolauri ! Danke für die Erläuterungen. Der Threaderstellerin ist damit leider nicht gedient. Aber der Hinweis auf "Opacity" scheint mir sinnvoll. Beim Lesen der Teile, die ich laden konnte, dachte ich auch mal kurz darüber nach. Ansonsten geht es mir da wir Dir : Komplett laden läßt sich das nicht. Wahrscheinlich irgendwo Verzeichnisschutz. Ist ja im Normalfall auch sinnvoll.

    Was benötigt ihr denn, vielleicht kann ich es euch ja zur Verfügung stellen? Auch dir natürlich danke!
  4. rotuganda schrieb:
    Und falls noch Jemand eine Idee hat wie ich dem IE den Mouseover mit css beibringen kann - ich wäre dankbar!

    Mouseover beim IE sollte - wie bei anderen Browsern - über die Pseudoklasse ':hover' gehen. Die Zeiten, in denen der IE das noch nicht konnte, sind vorbei (Glaub ich zumindestens).
    Falls ich falsch liegen sollte geht das mit EventHandlern und einem kleinen JavaScript-Code. Einfach in den HTML-Tag, bei dem der Effekt sein soll die beiden Attribute
    <div onmouseover="<!--Hier der JavaScript-->" onmouseout="<!--Hier der JavaScript-->"></div>

    Zu den EventHandlern: http://de.selfhtml.org/javascript/sprache/eventhandler.htm
    Das JavaScript musst du dir selbt basteln, bzw. ein fertiges Suchen. Wenn du mir genau sagst, was du möchtest, dann kann ich es auch mal probieren. Aber ich mag JavaScript persönlich nicht soo gerne und bin demnach auch nicht soo firm drin. :-D

    rotuganda schrieb:
    biolauri schrieb:
    ... Abhilfe könnte man hier durch absolutes Adressieren schaffen. Dabei - wie bei HTML einfach mit einem "/" anfangen und so ab dem HTML-Root referenzieren. Allerdings müsste man dazu sehr wahrscheinlich das ganze WP-Theme ändern...

    Dank dir!
    Das ganze Theme ändern "nur" damit der IE das anzeigt möchte ich nicht (und schaffe ich vermutlich auch nicht).

    Ich weiß auch gar nicht, ob das die Lösung des Problemes wäre. Und dafür ist es nun wirklich zu viel Aufwand. Also, wenn du dich beim Ändern von WP-Themes nicht so auskennst. Ich auch nicht - btw.
    Wegen der Opacity-Regel im CSS die war vorher auch schon da für die drei Elemente; RSS,FB,T und ich habe sie erst später den anderen Elemente zugefügt, sprich anfangs und da erschien im IE auch schon kein Bild war es garnicht definiert. Das hatte ich selbst schon als Fehlerquelle vermute und es deswegen anfangs gelassen, als ich dann bemerkte das es bei IE keinen Unterschied macht und im FF ein bisschen besser aussieht habe ich es erst hinzugefügt/gelassen.

    Ja, eigentlich ignoriert der IE die. Ich hatte nur die Vermutung, dass das ihn durcheinander bringt und er dann irgend einen Murks zusammenbringt. Aber wenn dem nicht so ist, dann können wir das auch schon einmal ausschließen.
    Was benötigt ihr denn, vielleicht kann ich es euch ja zur Verfügung stellen? Auch dir natürlich danke!

    hm. Also um das zu Testen, wären CSS- & HTML-Datei sinnvoll. Allerdings weiß ich gar nicht, wie das Plug-In arbeitet und weiß daher nicht, wie man da dran kommt.
  5. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    Hi,
    dank dir!
    Also mein Theme kann ich dir hier zum download anbieten: http://dl.dropbox.com/u/29997518/arras.zip Plugins die verwendet werden sind viele und haben auch nichts mit dem Problem zutun, denn vor der grafischen Änderung (ich habe nur die css verändert) ging ja alles. Verwendet wird aktuell die intoxi.css-Datei, es sind mehr im Themeordner enthalten.
    Vielleicht hilft dir das der Lösung näher zukommen?!
  6. Tut mir Leid. Ich habs mir runtergeladen. Allerdings findet keine der *.php-Dateien die Funktion 'get_header'.
    Ich kenne mich bei WP nicht sonderlich gut aus, weswegen ich wahrscheinlich sehr lange brauche, bis ich eine Lösung finde - wenn ich sie denn überhaupt finde.
    Dadurch kann ich es auch leider nicht weiter austesten.
    Tut mir Leid.
  7. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    Dank dir dennoch für deine nette Hilfe, es ist auch nicht so schlimm, die IE User haben ja ein kleines Menü und sehen eben nicht die schönere Optik.
  8. Bittebitte. Kein Problem. Das ist ja der Sinn diese Forums! ;-)
    Ja, sind sie selber Schuld, wenn sie den IE verwenden :-D
  9. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    Genau so sehe ich das auch, selber Schuld! :biggrin:
    Falls noch Jemand eine Idee hat wäre ich aber offen noch weiter zu versuchen :wave:
  10. Hi!

    Ich hab den Threat nun nicht gelesen, aber die Ansicht im IE6 ist schon sehr lustig! *grins* Alles auf dem Kopf... Bild

    Ich würde an deiner Stelle dem a das Hintergrundbild geben und den Linktext als title-Text nutzen (oder vielleicht kann man auch die Farbe "transparent" vergeben... weiß ich gar nicht oO"). Dann verpasse dem a ein
    display:block; overflow:hidden; width:auto;
    und es könnte funktionieren...

    Das ist nun das, was mir spontan einfällt - der IE mag Links keine Größe geben...

    Hast du mal versucht, den Elementen Rahmen zu verpassen um so mitzubekommen, bis zu welchem Element das Design noch funktioniert?
    Vielleicht legt der IE das Headerbild auch einfach über die Liste?

    Grüße
    things

    Beitrag zuletzt geändert: 31.5.2011 13:57:23 von things
  11. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    Dank dir für deine Antwort!
    Also ich habe versucht zu tun was du gesagt hast, ohne Erfolg. ich habe aber glaube ich auch nicht richtig verstanden was du mir geraten hast. Das hier ist der Auszug meiner CSS:
    /* main navigation */
    /*#nav  { background: url(../../images/topnav.jpg) no-repeat bottom #322C2C; min-width: 990px; height: 20px; } */
    #nav-content  { margin: 0 auto; min-width: 990px; }
    #nav .sf-menu  { float: left; line-height: 1.1; max-width: 990px; }
    #nav .sf-menu a  { display: block; text-decoration: none; padding: 80px 12px 11px; color: #AAA; font-size: 0px; }
    #nav .sf-menu ul li  { border: 1px solid #474331; margin-top: -1px; }
    /*
    #nav .sf-menu a:hover, #nav .sf-menu li:hover, #nav .sf-menu li.sfHover, #nav .sf-menu ul li  { background: #373331; color: #FFF; }
    #nav .sf-menu ul a:hover, #nav .sf-menu ul li.sfHover, #nav .sf-menu ul li:hover { color: #373331; background: #FFF; }
    #nav .sf-menu ul li.sfHover a.sf-with-ul { color: #373331; }
    
    nav .sf-menu a:hover, #nav .sf-menu li:hover, #nav .sf-menu li.sfHover, #nav .sf-menu ul li  { background: #373331; color: #FFF; }
    #nav .sf-menu ul a:hover, #nav .sf-menu ul li.sfHover, #nav .sf-menu ul li:hover { color: #373331; background: #FFF; }
    #nav .sf-menu ul li.sfHover a.sf-with-ul { color: #373331; }
    #nav .sf-menu li li a  { padding: 7px 10px; line-height: 1; height: auto; font-size: 12px; }
    #nav .sf-menu .sf-with-ul  { padding-right: 15px; }
    #nav .sf-sub-indicator  { width: 5px; height: 5px; text-indent: -9999px; display: inline-block; position: relative; left: 7px; top: 0; vertical-align: middle; }
    #nav .sf-menu ul .sf-sub-indicator        { display: none; } */
    
    #nav .quick-nav li  { padding-top: 8px; }
    
    html>body .quick-nav #rss, .quick-nav #rss:link, .quick-nav #rss:hover, .quick-nav #rss:active  {
    height: auto
    }
    .quick-nav li                        { padding: 1px 0 0 1px; }
    .quick-nav a:link, .quick-nav a:visited        { display: block; text-indent: -9000px; width: 16px; height: 16px; float: left; clear: left; opacity: 0.8; }
    .quick-nav a:hover  { opacity: 1; }
    
    
    .quick-nav #rss { display:block; background-image: url(../../images/menu/RSS-Polaroid.png)no-repeat; width: 80px; height: 90px; position: relative }
    
    .quick-nav #rss:link    { background: url(../../images/menu/RSS-Polaroid.png)no-repeat; text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    .quick-nav #rss:hover   { background-image:url(../../images/menu/RSS-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #rss:active  { background-image:url(../../images/menu/RSS-Polaroid-on.png);background-repeat:no-repeat; }
    
    
    .quick-nav #twitter { background: url(../../images/menu/Twitter-Polaroid.png)no-repeat; width: 80px; height: 90px; position: relative}
    
    .quick-nav #twitter:link    { text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    .quick-nav #twitter:hover   { background-image:url(../../images/menu/Twitter-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #twitter:active  { background-image:url(../../images/menu/Twitter-Polaroid-on.png);background-repeat:no-repeat; }
    
    
    .quick-nav #facebook { background: url(../../images/menu/Facebook-Polaroid.png)no-repeat; background-position:0px 0px; width: 80px; height: 90px; }
    
    .quick-nav #facebook:link    { text-decoration: underline;  font-size: 30px; color: #000; }
    .quick-nav #facebook:hover   { background-image:url(../../images/menu/Facebook-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #facebook:active  { background-image:url(../../images/menu/Facebook-Polaroid-on.png);background-repeat:no-repeat; }
    
    /*
    .quick-nav #facebook        { background: url(../../images/facebook.png) no-repeat; }
    .quick-nav #twitter                { background: url(../../images/twitter.png) no-repeat; }
    .quick-nav #rss                        { background: url(../../images/rss.png) no-repeat; }
    
    /* Start main navigation Mouseover */
    /* #menu-item-1226 = Home */
    
    #menu-item-1226 { background: url(../../images/menu/Home-Polaroid.png)no-repeat; background-position:0px 0px; width: 145px; height: 160px; opacity: 0.8; position: relative }
    
    #menu-item-1226:link    { text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    #menu-item-1226:hover   { background-image:url(../../images/menu/Home-Polaroid-on.png);background-repeat:no-repeat; opacity: 1; }
    #menu-item-1226:active  { background-image:url(../../images/menu/Home-Polaroid-on.png);background-repeat:no-repeat;opacity: 1; }
    
    /* #menu-item-1233 = Galerien */
    #menu-item-1233  { background: url(../../images/menu/Galerien-Polaroid.png)no-repeat; background-position:0px 0px; width: 145px; height: 160px; opacity: 0.8; }
    
    #menu-item-1233:link    { text-decoration: underline;  font-size: 30px; color: #000; }
    #menu-item-1233:hover   { background-image:url(../../images/menu/Galerien-Polaroid-on.png);background-repeat:no-repeat; opacity: 1;  }
    #menu-item-1233:active  { background-image:url(../../images/menu/Galerien-Polaroid-on.png);background-repeat:no-repeat; opacity: 1;  }

    Und hier die ganze zum Download: http://dl.dropbox.com/u/29997518/intoxi.css

    Wie genau oder wo genau sollte ich was einbauen?
  12. Du müsstest wohl einen neuen CSS-Tag machen:
    #menu-menu li a {
    display:block;
    overflow:hidden;
    }


    Und ich würde dem a-Tag das Bild zuweisen. Soweit ich weiß geht dann auch der Hover im IE, weil der nur Hovers auf as unterstützt

    in
    #menu-item-1226 a {
        background: url("../../images/menu/Home-Polaroid.png") no-repeat scroll 0 0 transparent;
        height: 160px;
        opacity: 0.8;
        position: relative;
        width: 145px;
    }


    Das Problem mit den auf den Kopf stehenden Bildern im IE6 hab ich nun bei meinem Projekt auch bekommen... ich versuche gerade herauszufinden, woher es kommt, aber zuversichtlich bin ich nicht grade... ôo

    Grüße
    things
  13. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    Es geht ! ! ! Du bist MEIN persönlicher Held! Vielen, vielen Dank!
    Ich habe aber noch eine weitere Frage; vorher war es so das das Hintergrundbild transparent war, der Hover aber nicht (im FF) jetzt ist es immer transparent, wie kann ich das ändern?
    Und weiterhin bin ich zu blöde die drei Elemente, RSS,Twitter und Facebook auf selbe Weise anzupassen, CSS-Datei an der Stelle sieht so aus:
    #nav .quick-nav li  { padding-top: 0px; }
    
    html>body .quick-nav #rss, .quick-nav #rss:link, .quick-nav #rss:hover, .quick-nav #rss:active  {
    height: auto
    }
    .quick-nav li                        { padding: 1px 0 0 1px; }
    .quick-nav a:link, .quick-nav a:visited        { display: block; text-indent: -9000px; width: 16px; height: 16px; float: left; clear: left; opacity: 0.8; }
    .quick-nav a:hover  { opacity: 1; }
    
    /* .quick-nav #rss */
    
    <!-- .quick-nav #rss a {
        background: url("../../images/menu/RSS-Polaroid.png") no-repeat scroll 0 0 transparent;
        height: 85px;
        opacity: 0.8;
        position: relative;
        width: 75px;
    }
    .quick-nav #rss a:hover {
        background: url("../../images/menu/RSS-Polaroid-on.png") no-repeat scroll 0 0 transparent;
        height: 85px;
        position: relative;
        width: 75px;
    } -->
    
    .quick-nav #rss { display:block; background-image: url(../../images/menu/RSS-Polaroid.png)no-repeat; width: 80px; height: 90px; position: relative }
    
    .quick-nav #rss:link    { background: url(../../images/menu/RSS-Polaroid.png)no-repeat; text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    .quick-nav #rss:hover   { background-image:url(../../images/menu/RSS-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #rss:active  { background-image:url(../../images/menu/RSS-Polaroid-on.png);background-repeat:no-repeat; }
    
    
    .quick-nav #twitter { background: url(../../images/menu/Twitter-Polaroid.png)no-repeat; width: 80px; height: 90px; position: relative}
    
    .quick-nav #twitter:link    { text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    .quick-nav #twitter:hover   { background-image:url(../../images/menu/Twitter-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #twitter:active  { background-image:url(../../images/menu/Twitter-Polaroid-on.png);background-repeat:no-repeat; }
    
    
    .quick-nav #facebook { background: url(../../images/menu/Facebook-Polaroid.png)no-repeat; background-position:0px 0px; width: 80px; height: 90px; }
    
    .quick-nav #facebook:link    { text-decoration: underline;  font-size: 30px; color: #000; }
    .quick-nav #facebook:hover   { background-image:url(../../images/menu/Facebook-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #facebook:active  { background-image:url(../../images/menu/Facebook-Polaroid-on.png);background-repeat:no-repeat; }
    
    /*
    .quick-nav #facebook        { background: url(../../images/facebook.png) no-repeat; }
    .quick-nav #twitter                { background: url(../../images/twitter.png) no-repeat; }
    .quick-nav #rss                        { background: url(../../images/rss.png) no-repeat; }

    Was muss ich da machen? Und stehen die Bilder in deinem IE immer noch Kopf? :scared:
  14. Da du das HGbild und die anderen Effekte (wenn du meinen Code so übernommen hast) nun vom li auf das a gelegt hast, musst du natürlich auch die hover anpassen:
    #menu-item-1226 a:hover {
    opacity: 1;
    }

    (Bildadresse und -position musst du beim hover nicht angeben, wenn sie sich nicht verändern. a:hover hat die selben Eigenschaften wie a + die neu definierten Eigenschaften)

    Für die Zusatzlinks natürlich erstmal wieder
    .quick-nav a {
    display:block;
    overflow:hidden;
    }

    Ich glaube, dass es das auch schon war. Du hast die Bilder und alles schon auf den Links. :)

    Die Bilder stehen noch immer auf dem Kopf, aber man kann sie sehen! :D Hier ansehen
    Ich glaube jedoch inzwischen, dass das irgendwie an meinem IE-Tester liegt. Ich habe eine html-Datei mit folgendem Code aufgerufen:
    <img src="BILDADRESSE.png" />

    und das Bild stand Kopf -.-"

    Wenn jemand noch eine echten IE6 hat, wäre es super, damit mal zu testen...

    Grüße
  15. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    Danke dir nochmals, das mit dem Transparent hat geklappt! Aber irgendwie bin ich zu doof, die drei kleinen Elemente angezeigt zubekommen...
    html>body .quick-nav #rss, .quick-nav #rss:link, .quick-nav #rss:hover, .quick-nav #rss:active  {
    height: auto
    }
    .quick-nav a {
    display:block;
    overflow:hidden;
    }
    
    .quick-nav li                        { padding: 1px 0 0 1px; }
    .quick-nav a:link, .quick-nav a:visited        { display: block; text-indent: -9000px; width: 16px; height: 16px; float: left; clear: left; opacity: 0.8; }
    .quick-nav a:hover  { opacity: 1; }
    
    
    /* .quick-nav #rss */
    
    .quick-nav #rss a {
        background: url("../../images/menu/RSS-Polaroid.png") no-repeat scroll 0 0 transparent;
        height: 85px;
        opacity: 0.8;
        position: relative;
        width: 75px;
    }
    .quick-nav #rss a:hover {
        background: url("../../images/menu/RSS-Polaroid-on.png") no-repeat scroll 0 0 transparent;
        height: 85px;
        opacity: 1;
        position: relative;
        width: 75px;
    }
    
    .quick-nav #rss { display:block; background-image: url(../../images/menu/RSS-Polaroid.png)no-repeat; width: 80px; height: 90px; position: relative }
    
    .quick-nav #rss:link    { background: url(../../images/menu/RSS-Polaroid.png)no-repeat; text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    .quick-nav #rss:hover   { background-image:url(../../images/menu/RSS-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #rss:active  { background-image:url(../../images/menu/RSS-Polaroid-on.png);background-repeat:no-repeat; }
    
    
    .quick-nav #twitter { background: url(../../images/menu/Twitter-Polaroid.png)no-repeat; width: 80px; height: 90px; position: relative}
    
    .quick-nav #twitter:link    { text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    .quick-nav #twitter:hover   { background-image:url(../../images/menu/Twitter-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #twitter:active  { background-image:url(../../images/menu/Twitter-Polaroid-on.png);background-repeat:no-repeat; }
    
    
    .quick-nav #facebook { background: url(../../images/menu/Facebook-Polaroid.png)no-repeat; background-position:0px 0px; width: 80px; height: 90px; }
    
    .quick-nav #facebook:link    { text-decoration: underline;  font-size: 30px; color: #000; }
    .quick-nav #facebook:hover   { background-image:url(../../images/menu/Facebook-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #facebook:active  { background-image:url(../../images/menu/Facebook-Polaroid-on.png);background-repeat:no-repeat; }
    
    /*
    .quick-nav #facebook        { background: url(../../images/facebook.png) no-repeat; }
    .quick-nav #twitter                { background: url(../../images/twitter.png) no-repeat; }
    .quick-nav #rss                        { background: url(../../images/rss.png) no-repeat; }


    Was mache ich falsch? :confused:
  16. Hi!

    Also ich hab mir die Seite mal gespeichert und hab den Code mal dreckig rein geschrieben. Er funktioniert und du musst ihn nur noch entsprechend einpflegen.

    Wichtig ist eben, dass du den LINKS das Bild zuweist und nicht dem LIs

    <style type="text/css">
    #nav a {
    	border:1px solid red; 
    	height: 160px;
        opacity: 0.8;
        position: relative;
        width: 145px;
    	background-repeat:no-repeat;
    	background-position:0 0;
    	background-color:transparent;
    }
    
    #menu-item-1226 a { 
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/Home-Polaroid.png");
    }
    #menu-item-1226 a:hover {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/Home-Polaroid-on.png");
    	opacity:1;
    }
    
    .quick-nav a {
        color: #000000;
        font-size: 30px;
        height: 90px;
        position: relative;
        text-decoration: underline;
        width: 80px;
        opacity: 0.8;
    	background-repeat:no-repeat;
    	background-position:0 0;
    	background-color:transparent;
    }
    
    #rss {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/RSS-Polaroid.png")
    }
    #rss:hover {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/RSS-Polaroid-on.png");
    	opacity:1;
    }
    
    </style>
  17. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    Dank dir hat geklappt jetzt sieht man alles in beiden Browsern und ich hoffe es steht auch nichts mehr auf dem Kopf?!
  18. Hi!

    Freut mich!

    In IE6 - 8 stehen die Bilder noch immer Kopf und im IE 7 & 8 ist der RSS-Link abgeschnitten (zu kleine Höhenangabe!?). Warum die Bilder Kopfstand machen, weiß ich noch immer nicht. Über eine Lösung des Problemes, wäre ich auch sehr froh!

    Du kannst dir das ganze ansehen, wenn du das Programm "IE Tester" herunter lädst - einfach mal googeln...

    Grüße
    things
  19. Autor dieses Themas

    rotuganda

    Kostenloser Webspace von rotuganda

    rotuganda hat kostenlosen Webspace.

    Hi,
    ja dank dir wieder diesen IE-Tester werde ich mir mal besorgen. Und das mit dem abgeschnittenen RSS-Icon habe ich auch bemerkt aber kann den Fehler nicht finden:
    .quick-nav a {
        color: #000000;
        font-size: 30px;
        height: 90px;
        position: relative;
        text-decoration: underline;
        width: 80px;
        opacity: 0.8;
            background-repeat:no-repeat;
            background-position:0 0;
            background-color:transparent;
    }
    
    #rss {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/RSS-Polaroid.png")
    }
    #rss:hover {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/RSS-Polaroid-on.png");
            opacity:1;
    }
    
    #twitter {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/Twitter-Polaroid.png")
    }
    #twitter:hover {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/Twitter-Polaroid-on.png");
            opacity:1;
    }
    
    #facebook {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/Facebook-Polaroid.png")
    }
    #facebook:hover {
        background-image: url("http://www.intoxi-hd.de/wp-content/themes/arras/images/menu/Facebook-Polaroid-on.png");
            opacity:1;
    }
    
    .quick-nav li                        { padding: 1px 0 0 1px; }
    .quick-nav a:link, .quick-nav a:visited        { display: block; text-indent: -9000px; width: 80px; height: 80px; float: left; clear: left; opacity: 0.8; }
    .quick-nav a:hover  { opacity: 1; }
    
    
    <!-- /* .quick-nav #rss */
    
    .quick-nav #rss a {
        background: url("../../images/menu/RSS-Polaroid.png") no-repeat scroll 0 0 transparent;
        height: 85px;
        opacity: 0.8;
        position: relative;
        width: 75px;
    }
    .quick-nav #rss a:hover {
        background: url("../../images/menu/RSS-Polaroid-on.png") no-repeat scroll 0 0 transparent;
        height: 85px;
        opacity: 1;
        position: relative;
        width: 75px;
    }
    
    .quick-nav #rss { display:block; background-image: url(../../images/menu/RSS-Polaroid.png)no-repeat; width: 80px; height: 90px; position: relative }
    
    .quick-nav #rss:link    { background: url(../../images/menu/RSS-Polaroid.png)no-repeat; text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    .quick-nav #rss:hover   { background-image:url(../../images/menu/RSS-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #rss:active  { background-image:url(../../images/menu/RSS-Polaroid-on.png);background-repeat:no-repeat; }
     -->
    
    
    .quick-nav #twitter { background: url(../../images/menu/Twitter-Polaroid.png)no-repeat; width: 80px; height: 90px; position: relative}
    
    .quick-nav #twitter:link    { text-decoration: underline;  font-size: 30px; color: #000; width: 80px; height: 90px; position: relative }
    .quick-nav #twitter:hover   { background-image:url(../../images/menu/Twitter-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #twitter:active  { background-image:url(../../images/menu/Twitter-Polaroid-on.png);background-repeat:no-repeat; }
    
    
    .quick-nav #facebook { background: url(../../images/menu/Facebook-Polaroid.png)no-repeat; background-position:0px 0px; width: 80px; height: 90px; }
    
    .quick-nav #facebook:link    { text-decoration: underline;  font-size: 30px; color: #000; }
    .quick-nav #facebook:hover   { background-image:url(../../images/menu/Facebook-Polaroid-on.png);background-repeat:no-repeat; }
    .quick-nav #facebook:active  { background-image:url(../../images/menu/Facebook-Polaroid-on.png);background-repeat:no-repeat; }
    
    /*
    .quick-nav #facebook        { background: url(../../images/facebook.png) no-repeat; }
    .quick-nav #twitter                { background: url(../../images/twitter.png) no-repeat; }
    .quick-nav #rss                        { background: url(../../images/rss.png) no-repeat; }

    Aber ich sehe es auch, habe den IE-Tester runtergeladen, taucht in der Version 8 auf ?! :confused:
  20. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!