Lynn: firefox zeigt gif-anker in td nicht an

Beitrag lesen

Hallo liebe Community...

habe ein seltsames Prob weil ja normalerweise der ie layouts zerschießt und firefox sich ganz gut benimmt ;)

habe in einer einer Tabellenzeile mit 3 tds 2 gifs die als anker bzw. navi dienen (vor/zurück)

und noch ein seperates div mit back-gif sozusagen

sobald ich display:block oder float raushau, taucht wenigstens im firefox das back-pfeilchen auf dafür verschwindet die navi im ie gänzlich...

hier mal der html-teil:
<body>

<div class="bgSG">blub</div>

<div class="imgMenu">
<a class="backArrow" href="workings_Overview.htm"></a>
</div>

<div class="galleryView">

<div class="galleryNavi">

<table class="imgNavi">
   <tr>
    <td class="arrows"> <a class="arrowL" href="aluminium_workings.htm"></a></td>
       <td class="imgtitle">Feldweg</td>
       <td class="arrows"> <a class="arrowR" href="view_img2_aluguss.htm"></a></td>
   </tr>
 </table>

</div>

und hier das css dazu:

/* einzelbild navigation */

div.imgMenu {
        position: absolute;
 width: 40px;
        height: 20px;
 left: 760px;
        top: 120px;
 background-color:transparent;
 border: 1px solid #888 ; }

a.backArrow {
 background: url(gifs/linkpfeil_back.gif);
 background-repeat: no-repeat;
 background-position:center;
 float:left;
 background-color: #DDD;
 border: 1px;
 width: 20px ;
        margin-left:10px;
        margin-right:10px; }

div.galleryView {
        overflow: auto;
 position: absolute;
 width: 600px;
 height: 300px;
 top: 150px;
 left: 200px;
 background-color:#DDD;
 border:1px solid #888; }

div.galleryNavi {
        width: 590px;
        height: 20px;
        padding: 5px;
        font: bold 12px verdana;
        background-color:#CCC; }

table.imgNavi{
 width: 580px;
 margin-left:5px;
 margin-right:5px;}

td.arrows {
        width: 50px;
 }

td.imgtitle {
         width: 520px;
         text-align: center; }

a.arrowL {width: 15px;
   float:left;
   background: url(gifs/linkpfeil_l.gif);
   background-color:#DDD;
   background-repeat: no-repeat;
   background-position:left; }

a.arrowR {width: 15px;
   float:right;
   background: url(gifs/linkpfeil_r.gif);
   background-color:#DDD;
   background-repeat: no-repeat;
   background-position: right;
   margin-left:40px; }

div.form {
 overflow: auto;
 width: 580px;
 height:280px;
 margin:8px;
 left:5px;
 font: bold 12px verdana;
 background-color:#CCC; }

div.imgDescription {
         width: 210px;
         float: left;
         margin: 5px;
         padding: 5px;
         font: normal 12px verdana;
  border:1px solid #888; }

bin jetzt schon über 3hs am rumprobieren und verzweifeln...
hat irgendjemand mal einen tipp?

herzlichen dank im Voraus Lynn