float kollidiert mit position absolute (nur <=IE7)

[Detlef G.]

Hallo André

Habe es einmal nach Deiner Version versucht und den Pfeil einzeln absolut positioniert. Abgesehen davon, dass sich an dem Problem nichts ändert, da der Pfeil leider nicht wie im IE8 an der linken Seite des Textes positioniert wird, sondern rechts von der Scroll-Leiste, taucht dann ein weiteres Problem auf. Ich bekomme jetzt den zweiten Pfeil nicht auf die rechte Seite.

Meinst du dies:

#pageNavigationText {  
	top: 481px;  
	width: 12px;  
	position:absolute;  
}  
  
#pageNavigationLeft {  
	top: 481px;  
	width: 12px;  
	position:absolute;  
	z-index:100;  
}  
  
#pageNavigationRight {  
	top: 481px;  
	width: 12px;  
	position:absolute;  
}  
  
#alignLeft {  
	margin-right: 770px;  
}  

Und dazu das HTML:
~~~html <div id="pageNavigationText"><span id="alignLeft">
<a href="bibliotheken15_de.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('prevPage','','../images/pageArrowLeft_White_over.jpg',1)"><img src="../images/pageArrowLeft_White_up.jpg" width="12" height="13" alt="Zur vorherigen Seite" name="prevPage" /></a>
</span>
<a href="bibliotheken17_de.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('nextPage','','../images/pageArrowRight_White_over.jpg',1)"><img src="../images/pageArrowRight_White_up.jpg" width="12" height="13" name="nextPage" /></a>
<!-- pageNavigationText --></div>

  
Ich finde darin weder #pageNavigationLeft noch #pageNavigationRight, da können deine Regeln auch nicht wirken.  
  
Du könntest z.B. Folgendes machen:  
Gib #columnMainContent ein position:relative, damit sich die folgenden absoluten Positionierungen darauf beziehen.  
Dann ersetzt du den obigen CSS-Teil, also von #pageNavigationText { bis margin-right: 770px; } komplett durch:  
  
~~~css
#pageNavigationText a {  
	top: 371px;  
	width: 12px;  
	position:absolute;  
        right:0;  
}  
#alignLeft a{  
	position:absolute;  
        left:0;  
}  

Besser wäre allerdings, du räumst HTML und CSS komplett vernünftig auf. Irgendwie sieht das alles sehr unübersichtlich aus, als ob dort noch viele auch gescheiterte Versuche drinstecken.

So ist #pageNavigationText vollständig unnötig, wie auch span#alignLeft. Stattdessen einfach nur die Links mit der jeweiligen Grafik:

<a id="pageNavigationPrev" href="bibliotheken15_de.php"><img src="../images/pageArrowLeft_White_up.jpg" width="12" height="13" alt="Zur vorherigen Seite" name="prevPage" /></a>  
<a id="pageNavigationNext" href="bibliotheken17_de.php"><img src="../images/pageArrowRight_White_up.jpg" width="12" height="13" name="nextPage" /></a>  

Und im CSS dürfte dann das reichen:

#pageNavigationPrev, pageNavigationNext {  
	position:absolute;  
	top: 371px;  
        left:0;  
}  
[code lang=css]#pageNavigationNext {  
        right:0;  
}  

Übrigens lassen sich Hovereffekte auch ohne Javascript nur mit CSS und ohne MM_-Funktionen realisieren

Auf Wiederlesen
Detlef