IE 6 Probleme

[assmaje]

Hi Leute,

PSP-SPIELEBASE | Startseite

hab mich über Transparenz im IE 6 informiert und schließlich eine scheinbar gute Variante gefunden, die allerdings nicht korrekt funktioniert... Betrifft nur meine Navi, ansonsten verwende ich keine transparenten (Hintergrund-)Bilder. Weiß vielleicht jemand, wo der Fehler liegt? Oder kennt ihr vielleicht bessere Methoden?

    <!--[if lt IE 7]>
      <script type="text/javascript" src="unitpngfix.js"></script>
    <![endif]-->

          <div id="navi">
            <div id="downloads">

              <a id="demos" class="orange" href="index.php?page=demos" title="Demos">Demos</a>
              <a id="programme" class="orange" href="index.php?page=programme" title="Programme">Programme</a>
              <a id="flash" class="orange" href="index.php?page=flash" title="Flash">Flash</a>
              <a id="homebrew" class="orange" href="index.php?page=homebrew" title="Homebrew">Homebrew</a>
              <a id="themes" class="orange" href="index.php?page=themes" title="Themes">Themes</a>
              <a id="wallpaper" class="orange" href="index.php?page=wallpaper" title="Wallpaper">Wallpaper</a>

              <br class="clear">

              <span class="navi_first">Demos</span>
              <span class="navi">Programme</span>
              <span class="navi">Flash</span>
              <span class="navi">Homebrew</span>
              <span class="navi">Themes</span>
              <span class="navi">Wallpaper</span>

              <br class="clear">

            </div>
          </div>

div#navi
{
  padding:36px 20px 35px 20px;
  background:url(images/navi.png) repeat-x;
}

div#downloads
{
  width:434px;
  margin:0px auto;
}

a#demos, a#programme, a#flash, a#homebrew, a#themes, a#wallpaper
{
  display:block;
  width:64px;
  height:64px;
  float:left;
  font-size:0px;
}

a#demos
{
  background:url(images/navi/demos.png) no-repeat;
}

a#programme
{
  margin-left:10px;
  background:url(images/navi/programme.png) no-repeat;
}

a#flash
{
  margin-left:10px;
  background:url(images/navi/flash.png) no-repeat;
}

a#homebrew
{
  margin-left:10px;
  background:url(images/navi/homebrew.png) no-repeat;
}

a#themes
{
  margin-left:10px;
  background:url(images/navi/themes.png) no-repeat;
}

a#wallpaper
{
  margin-left:10px;
  background:url(images/navi/wallpaper.png) no-repeat;
}

#demos:hover, #programme:hover, #flash:hover, #homebrew:hover, #themes:hover, #wallpaper:hover
{
  background-position:-64px 0px;
}

span.navi_first, span.navi
{
  display:block;
  width:64px;
  float:left;
  font:10px Arial;
  text-align:center;
}

span.navi
{
  margin-left:10px;
}

Zudem ist die linke obere Ecke nicht abgerundet (wie auf der rechten Seite) und es gibt unerwünschte Abstände im Contentbereich und unter den Navi-Bildern. (siehe hier) Aber vorerst ist das Transparenz-Problem am wichtigsten. Danke schon mal für eure Antworten. :)