# Spacer, Tabellen und Probleme =)



## Billie (22. Januar 2003)

!olleH

Also, ich hab's schon im Postnuke.de Forum probiert, aber ich glaub ihr könnt mich besser Beraten. Hab hier nämlich schon oft nützliche Infos gefunden. Also es geht darum, ich nehme jetzt das Beispiel Postnuke (CMS)... Da gibt es festgelegte Standard-Themes und ich wollte nun natürlich den oberen Teil (Logo etc.) umändern.

Ich habe mein Bild erstellt 780 x 150 Pixel, es in Photoshop noch schön kleingestückelt und alls ich dann in Dreamweaver die passende Tabelle dazu erstellen wollte, hat's einfach nicht funktioniert. Jedesmal wenn ich zB die letzte Spalte od. Zeile zusammenfügen wollte, verschiebte sich die ganze Tabelle kreuz und quer! Ich hab mir dann das Postnuke Theme näher angesehn und die haben das anscheinend mit Spacer.gif's gelöst... und ein Tag </tbody> war mir auch neu. Auf alle Fälle war ich schlussendlich gezwungen meine Bilder genau auf die Postnuke-Größe zuzuschneiden.

Funktioniert, aber naja... was ist wenn ich wirklich mal meine eigene Tabelle will? Hat jemand Tutorials od. Tip's wie man zeigt, sauber Tabellen mit der Unterstützung von Platzhaltern (spacer.gif) zu erstellen?

Danke für alle Antworten!


----------



## Andreas Gaisbauer (23. Januar 2003)

Hi,

etwas Code und/oder Screenshots wären hilfreich...

ciao Andreas


----------



## Billie (21. Februar 2003)

Link 


```
<TABLE cellSpacing=0 cellPadding=0 width=780 border=0>
 <TBODY>
  <TR>
   <TD><IMG height=1 src="img/spacer.gif" width=39  border=0></TD>
   <TD><IMG height=1 src="img/spacer.gif" width=13  border=0></TD>
   <TD><IMG height=1 src="img/spacer.gif" width=8   border=0></TD>
   <TD><IMG height=1 src="img/spacer.gif" width=471 border=0></TD>
   <TD><IMG height=1 src="img/spacer.gif" width=20  border=0></TD>
   <TD><IMG height=1 src="img/spacer.gif" width=4   border=0></TD>
   <TD><IMG height=1 src="img/spacer.gif" width=22  border=0></TD>
   <TD><IMG height=1 src="img/spacer.gif" width=203 border=0></TD>
   <TD><IMG height=1 src="img/spacer.gif" width=1   border=0></TD>
  </TR>
  <TR>
   <TD rowSpan=5><IMG height=150 src="img/HeaderLeft.gif" width=39  border=0 name=HeaderLeft></TD>
   <TD colSpan=4><IMG height=14 src="img/HeaderTop3.gif" width=512 border=0 name=HeaderTop3></TD>
   <TD colSpan=2 rowSpan=2><IMG height=39 src="img/HeaderTop2.gif" width=26 border=0 name=HeaderTop2></TD>
   <TD bgColor=#000000 rowSpan=2><IMG height=1 src="img/spacer.gif" width=1 border=0 name=HeaderTopLogoBG> 
    <DIV align=right><SPAN class=slogan>Sep 03, 2002 - 05:02 
     PM&nbsp;&nbsp;</SPAN></DIV>
   </TD>
   <TD><IMG height=14 src="img/spacer.gif" width=1 border=0></TD>
  </TR>
  <TR>
   <TD><IMG height=25 src="img/HeaderTop1.gif" width=13 border=0 name=HeaderTop1></TD>
   <TD bgColor=#000000 colSpan=3><IMG height=1 src="img/spacer.gif" width=1 border=0 name=HeaderBG>
    <SPAN class=slogan>Your Site Name</SPAN>
   </TD>
   <TD><IMG height=25 src="img/spacer.gif" width=1 border=0></TD>
  </TR>
  <TR>
   <TD colSpan=5><IMG height=24 src="img/BannerTop.gif" width=516 border=0 name=BannerTop></TD>
   <TD colSpan=2 rowSpan=3><IMG height=111 src="img/HeaderLogo.gif" width=225 border=0 name=HeaderEye></TD>
   <TD><IMG height=24 src="img/spacer.gif" width=1 border=0></TD>
  </TR>
  <TR>
   <TD colSpan=2><IMG height=63 src="img/BannerLeft.gif" width=21 border=0 name=BannerLeft></TD>
   <TD background="img/BannerContentBG.jpg">&nbsp;</TD>
   <TD colSpan=2><IMG height=63 src="img/BannerRight.gif" width=24 border=0 name=BannerRight></TD>
   <TD><IMG height=63 src="img/spacer.gif" width=1 border=0></TD></TR>
  <TR>
   <TD colSpan=5><IMG height=24 src="img/BannerBott.gif" width=516 border=0 name=BannerBott></TD>
   <TD><IMG height=24 src="img/spacer.gif" width=1 border=0></TD>
  </TR>
  <TR>
    <TD colSpan=8><IMG height=10 src="img/HeaderBottbg.gif" width=780 border=0 name=HeaderBottbg></TD>
   <TD><IMG height=10 src="img/spacer.gif" width=1 border=0></TD>
  </TR>
 </TBODY>
</TABLE>
```


----------



## Billie (26. Februar 2003)

*schieb*

Och kommt schon, es muss doch jemand wissen wie man so schöne Tabellen erstellen kann  Od. gebt mir ein paar Quellen wo ich mir die Info's vielleicht selber hohlen kann. Ich will einfach auch schöne Tabellen erstellen können, wie z.B. gerade diese Eingabemaske für's Forum - ich möchte gar nicht wissen wie verschachtelt und wieviele Spacer hier verwendet wurden. Aber ich würd's gerne selber können 8)


----------



## Avariel (27. Februar 2003)

Ok, da anscheinend niemand kompetentes antworten will, muss ich wohl 

Warum willst du überhaupt deine Tabellen manuell einrichten? Wenn du dein Design eh schon mit PS gemacht hast, musst du doch eigentlich nur noch das Teil per Image Ready slicen und dann erstellt dir IR deine Tabelle automatisch...

Und ich glaub nicht das es ein Tutorials "wie erstelle ich tabellen" gibt. Man stückelt halt seine Tabellen so zusammen das es passt. Wenn was verrutscht würde ichs mal mit Blindgifs probieren.


----------



## Billie (27. Februar 2003)

> _Original geschrieben von Avariel _
> *Ok, da anscheinend niemand kompetentes antworten will, muss ich wohl
> 
> Warum willst du überhaupt deine Tabellen manuell einrichten? Wenn du dein Design eh schon mit PS gemacht hast, musst du doch eigentlich nur noch das Teil per Image Ready slicen und dann erstellt dir IR deine Tabelle automatisch...
> ...



Ja, DANKE Avariel!!!

Öha, ImageReady kann sowas *glucks* Ups *ggg* Und zu den Blindgif's, ich weiss eben noch nicht wirklich 100%ig genau wie man solche Blindgif's einsetzt =)


----------



## Avariel (27. Februar 2003)

Blindgifs sind eigentlich recht simpel, du machst einfach mit Photoshop ein Bild, Größe 1x1 Pixel und transparent. Fürs Web speichern als *.gif.
Wenn du jetzt dann eine Tabelle hast, mit Größe 100% und zwei Spalten und willst in die zweite Spalte was schreiben aber in die erste nicht. Trotzdem soll die (leere) erste Spalte ne Breite von 30px haben. Dann fügst du einfach dein Blindgif in die erste Spalte ein und fügst den Code dazu.
Hier mal ein Beispiel:


```
<img src="blind.gif" width="30" height="1">
```

width ist die Breite, height ist die Höhe des Bildes. Dann denkt die Tabelle da ist was drin, also verschiebt sie sich nicht weiter, aber für den Betrachter ist die Tabelle leer. Die Tatsache das dein Bild auch nur 1x1px groß ist, macht das ganze dann noch superschnell zu laden.


----------



## Fabian H (27. Februar 2003)

Ähm nur mal so ne Frage am Rande:

Ist das hier dann nicht valide?

```
<table width=100%>
    <tr>
        <td width=100>&nbsp;</td>
        <td>bla bla bla</td>
    </tr>
</table>
```


----------



## Avariel (28. Februar 2003)

Hmmm...valide = gültig laut selfhtml...

Freilich ist der Code gültig. Ist zwar n bisschen Sinnlos die Tabelle erst 100% zu machen, wenn man sie im td sowieso wieder auf 100px zurechtschnipselt, aber theoretisch möglich sollte das sein.


----------

