satanicsurfer: problem: tabelle mit div und span

Beitrag lesen

Hi, habe folgendes Problem:

Ich erzeuge mit einem div Container eine virtuelle Tabellenzeile. Nun möchte ich vier virtuelle Spalten mit 2px Abstand zwischen jeder Zelle. Mit div würde es funktionieren, da div aber ein Block-Element ist macht er jedes mal ein zeilenumbruch. Mit span funktioniert es nicht, weil ich da keine feste Breite zuweisen kann. Und ich brauch eine feste Breite, weil ich einen vorgegebenen Tabellenheader mit festen Spaltengrößen habe.

ich hab mal ein Code-Beispiel rangehängt, damit ihr wisst wie ich mir das gedacht habe:

Hier mein HTML-Code:

  
<div class="tabelle">  
 <div class="zeile1">  
  <span class="spalte1">textbeispiel</span>  
  <span class="spalte2">textbeispiel</span>  
  <span class="spalte3">textbeispiel</span>  
  <span class="spalte4">textbeispiel</span>  
 </div>  
 <div class="zeile2">  
  <span class="spalte1">textbeispiel</span>  
  <span class="spalte2">textbeispiel</span>  
  <span class="spalte3">textbeispiel</span>  
  <span class="spalte4">textbeispiel</span>  
 </div>  
</div>  

Und hier CSS:

  
.tabelle {  
 position:relative;  
 width:1000px;  
 top:40px;  
 margin-bottom:40px;  
 overflow:auto;  
}  
  
.zeile1 {  
 position:absolute;  
 width:1000px;  
 top:5px;  
}  
  
.zeile2 {  
 position:absolute;  
 width:1000px;  
 top:105px;  
}  
  
.spalte1 {  
 background-color:#cddce4;  
 width:110px;  
 margin-left:2px;  
}  
  
.spalte2 {  
 background-color:#cddce4;  
 width:153px;  
 margin-left:114px;  
}  
  
.spalte3 {  
 background-color:#cddce4;  
 width:107px;  
 margin-left:269px;  
}  
  
.spalte4 {  
 background-color:#cddce4;  
 width:620px;  
 margin-left:378px;  
}  

Das Problem bei dieser Konstelation ist, dass die Breite bei span nichts bringt und er automatisch die breite, je nach Inhalt anpasst. Aber ich bräuchte eine feste Breite und bei zu großem Inhalt soll die Höhe automatisch verändert werden.