PNG-fix en navigatie werken niet

[DNA_Saint]

Hallo beste mensen,

Ik ben momenteel bezig met mn portfolio. Maar nu heb ik 2 problemen. En deze problemen zijn alleen met IE6.

Website: www.andy-man.nl

Probleem 1. PNG Fix.
Ik heb al 2 geprobeerd, maar beiden werken niet.
deze 2 heb ik geprobeerd:
http://www.twinhelix.com/css/iepngfix/demo/
http://homepage.ntlworld.com/bobosola/

Misschien gebruik ik verkeerde html ofzo, maar het werkt maar niet.
Wie weet een betere of hoe ik dit werkend moet krijgen?

Probleem 2. Navigatie
Zoals je in IE6 kan zien, werkt het menu gewoon niet goed. En daarmee bedoel ik de hover status.

HTML:

HTML:

      <div id="navigation">
        <div id="navigation-header">
          <h1>MainMenu</h1>
        </div>
        <!-- afsluiting navigation-header-->
        <div class="nav-roundcont">
                  <div class="roundtop"> <img src="images/tl.gif" alt="" 
                             width="8" height="8" class="corner" 
                             style="display: none" /> </div>
          <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Over mij</a></li>
            <li><a href="#">CV</a></li>
            <li><a href="#">POP</a></li>
            <li><a href="#">Portfolio</a></li>
            <li><a href="#">Contact</a></li>
            <li><a href="#">Links</a></li>
          </ul>
          <div class="nav-roundbottom"> <img src="images/bl.gif" alt="" 
                             width="8" height="8" class="corner" 
                             style="display: none" /> </div>
          <!-- afsluiting roundbottom-->
        </div>
        <!-- afsluiting roundcon-->
      </div>
      <!-- afsluiting navigation-->

de CSS:

Cascading Stylesheet:

#navigation {
        width: 278px;
        float:left;
        margin-left:20px; 
        color:#34ab03;
        }
        
#navigation-header {
        background-image:url(../images/heading-navigatie.png);
        background-repeat:no-repeat;
        height:25px;    
        padding-top: 11px;
        padding-left: 18px;
        margin-left: 42px;
        }       

#navigation a {
        color:#34ab03;
        text-decoration:none;
        display: block;
        }
        
#navigation a:hover {
        color:#fff;
        height: 50px;
        width:100%;
        }       

#navigation ul {
        font-size:13px;
        font-weight:bold;
        letter-spacing:7px;
        line-height:50px;
        padding-left:20px;
        }

#navigation ul li:hover {       
        background-image:url(../images/main-menu-hover.gif);
        background-repeat:repeat-x;
        margin-left:-20px;
        padding-left:20px;
        color:#fff;
        }

[killercow]

Je hover probleem is gewoon het feit dat IE6 alleen :hover support op A elementen.

http://www.xs4all.nl/~peterned/csshover.html

[Duroth]

Wat je PNG-probleempje betreft; je weet dat dit alleen werkt op achtergronden, en niet op <img> elementen? Je sidenotes zijn <img> elementen, die zullen nooit gaan werken op deze manier.

Hover-probleem is op te lossen door a) enkel gebruik te maken van a elementen met een :hover, of door javascript (iets in de trend van onmouseOver=this.className=' ';")

[DNA_Saint]

Maar mijn mijn menu heading werkt het ook niet. En bij de footer ook niet, terwijl die als achtergrond ingesteld zijn.
Maar op deze site:
http://www.twinhelix.com/css/iepngfix/demo/

daar is het ook met een <img>?

[killercow]

Duroth schreef op dinsdag 04 december 2007 @ 17:39:
Wat je PNG-probleempje betreft; je weet dat dit alleen werkt op achtergronden, en niet op <img> elementen? Je sidenotes zijn <img> elementen, die zullen nooit gaan werken op deze manier.

Hover-probleem is op te lossen door a) enkel gebruik te maken van a elementen met een :hover, of door javascript (iets in de trend van onmouseOver=this.className=' ';")

<img> kan ook prima met de png hack gefixed worden.

[DNA_Saint]

maar, wat is nou nu eigenlijk de oplossing op mijn png probleem?
Want <img> kan dus wel, maar ik heb op mn site ook gewoon png's als achtergrondafbeelding en die werken ook niet.

[Juup]

Beide zijn te fixen met de IE6 fixer van Dean Edwards: http://dean.edwards.name/IE7/
Maar ook daarbij is het even rommelen om die PNG transparantie goed te krijgen.

Lees de fora van de betreffende fix-sites.