✔ Tabellenzellen unregelmäßg

[kellykatz]

Hallo,

mein Problem ist folgendes: Ich möchte einfach eine Tabelle mit Bildinhalten erstellen. Aus irgendeinem Grund sind die Zellen unregelmäßig hoch und die Bilder darin unterschiedlich Positioniert. Auch wenn ich align=middle eingebe und im css code padding und margin auf 0 setze (auch bei den Bildern) passiert nichts. Die Bilder sind auch 100ig gleichgroß. Ich weiß nicht, ob es an HTML oder am CSS liegen könnte.

hier einmal der HTML Code:

<table class="gallery" cellpadding="0" cellspacing="3px" border="0" id="tabelle2" style="display:none;">
      <tr>
       <td align="center">
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/1.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_1.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_1.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_1.jpg'" /></a>

       </td>
       
       <td align="center">
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/2.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_2.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_2.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_2.jpg'" /></a>
       </td>
       
       <td align="center">   
        <a href="inhalte/galerie/bilder/charis/Digital/bilder/3.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_3.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_3.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_3.jpg'" /></a>
       </td>
      </tr>
       
        <tr>
       <td align="center">
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/4.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_4.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_4.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_4.jpg'" /></a>
       </td>
       
       <td align="center">
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/5.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_5.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_5.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_5.jpg'" /></a>
       </td>
       
       <td align="center"> 
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/5.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_6.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_6.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_6.jpg'"/>  
       </td>
       </tr>
       
       <tr>
       <td align="center">
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/7.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_7.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_7.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_7.jpg'"/></a>
       </td>
       
       <td align="center">
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/8.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_8.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_8.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_8.jpg'" />
       </td>
       
       <td align="center"> 
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/9.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_9.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_9.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_9.jpg'" /></a>
       </td>
       </tr>
       
       <tr>
       <td align="center" >
       <a href="inhalte/galerie/bilder/charis/Digital/bilder/10.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_10.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_10.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_10.jpg'" /></a>
       </td>
       
       <td>
       </td>
       
       <td> 

       </td>
       </tr>
       
     </table>
    
    </div>

und hier das CSS:

.gallery{
width:100%;
}

.gallery td{
height:56px;
width:77px;
padding:0;
margin:0;
}

.gallery img{
border:0;
border:3px solid black;
padding:0;
margin:0;
}

Ich bedanke mich im Voraus

kelly

 

[Maik]

Hi,

beim Überfliegen deines HTML-Codes fällt auf, dass zwischendurch ein paar schliessende </a>-Tags fehlen, wie z.B. hier:

<a href="inhalte/galerie/bilder/charis/Digital/bilder/5.jpg" target="_blank"><img src="inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_6.jpg" onmouseover="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_6.jpg'" onmouseout="this.src='inhalte/galerie/bilder/charis/Digital/thumbs/thumb_grau_6.jpg'"/>

Und welches Breitenmaß ist hier nun maßgeblich? Das der Tabelle (width:100%), oder das der Tabellenzellen (width:77px)?

Übrigens ist die margin:0-Regel für die Tabellenzellen sinnfrei, da das <td>-Element im Tabellengerüst überhaupt keinen Außenabstand besitzt, der auf null zurückgesetzt werden müsste

Und in HTML-Attributen wird grundsätzlich keine Einheit (px) angegeben, wie im Falle des cellspacing-Attributs.

mfg Maik

 

[Maik]

Aus irgendeinem Grund sind die Zellen unregelmäßig hoch und die Bilder darin unterschiedlich Positioniert.

Kann ich mit deinem gezeigten Code nicht bestätigen:



In welchem Browser taucht denn bei dir dieser Fehler auf?

Ich hab's mir eben in den aktuellen Versionen von Firefox, IE, Opera und Safari angeschaut, und das Ergebnis siehst du ja.

mfg Maik

 

[kellykatz]

Heya, danke für die Antworten, es lag tatsächlich daran, dass ich die a-tags nicht geschlossen hatte.

Ich bin leider sehr schusselig und selbst fällt einem ein Fehler meist schwieriger auf, als einem Unabhängigen.

Jetzt klappt es jedenfalls

Vielen Dank nochmal

kelly

 

[Maik]

Ob du's glaubst, oder nicht, mein Schnappschuß basiert auf deinem geposteten Original-Code, den ich nicht fehlerkorrigiert, sondern lediglich mein schickes Avatar darin eingepflanzt habe

Und in welchem Browser trat bei dir nun der Fehler auf?

mfg Maik