Sbin: table-layout: fixed

Beitrag lesen

SELF-Forum

table-layout: fixed

Sbin
– Informationen zu den Bewertungsregeln

Hallo...

Ich habe eine Bildergalerie erstellt, in der unten 14 Thumbnails zu sehen sind und oben ein großes Bild, welches sich mittels Jvascript(viewpic), durch ein Klick auf das Vorschaubild, automatisch verändert wird. Da die Bilder verschieden Abmessungen haben, versuche ich sie mittig zu positionieren und mittels table-layout:fixed; zu beschneiden.
Leider war ich mit folgendem Quelltext noch nicht erfolgreich.

  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
[...]  
<body>  
<table border="0" cellpadding="0" cellspacing="16" id="pic" style="table-layout:fixed;position:absolute;top:142px;margin-bottom:30px;">  
 <tr>  
  <td></td>  
  <td colspan="3" valign="center" align="center" height="298" width="434"><img src="/data/8/1.jpg" id="startbild" name="startbild"/></td>  
  <td colspan="3" align="left" valign="bottom"></td>  
 </tr>  
 <tr id="zeile">  
  <td><a href="javascript:viewpic('/data/8/1.jpg')"><img src="/data/8/1.jpg" width="133" height="91"/></a></td>  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/2.jpg')"><img src="/data/8/2.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/3.jpg')"><img src="/data/8/3.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/4.jpg')"><img src="/data/8/4.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/5.jpg')"><img src="/data/8/5.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/6.jpg')"><img src="/data/8/6.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/7.jpg')"><img src="/data/8/7.jpg" style="width:133px;height:auto;">  
 </tr>  
 <tr id="zeile">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/8.jpg')"><img src="/data/8/8.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/9.jpg')"><img src="/data/8/9.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/10.jpg')"><img src="/data/8/10.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/11.jpg')"><img src="/data/8/11.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/12.jpg')"><img src="/data/8/12.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/13.jpg')"><img src="/data/8/13.jpg" style="width:133px;height:auto;">  
  <td width="133" height="91"><a href="javascript:viewpic('/data/8/14.jpg')"><img src="/data/8/14.jpg" style="width:133px;height:auto;">  
 </tr>  
</table>  
</body>

Ich hoffe ihr könnt mir helfen und vielen Dank im Vorraus
Sbin

Beitrag melden
–
Informationen zu den Bewertungsregeln