• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tabelle mit flexibler Breite

Status
Für weitere Antworten geschlossen.

curveball

Neues Mitglied
Hallo @ all !!

Hab da gerade ein Problem, welches mich beschäftigt !! und vielleicht wisst ihr da einen Lösungsansatz !!

Wie kann kann ich eine Tabelle so attributieren, dass sie immer die maximal zur Verfügung gestellte Breite einnimmt ?

Die Tabelle befindet sich in einem div-Container, welcher automatisch die ihm zur Verfügung gestellte Breite einnimmt, seine Ausdehnung ist lediglich durch ein Padding bestimmt.
In diesen div-Container möchte ich eben diese Tabelle bringen, die sich flexibel der maximalen Breite des div-Containers anpassen soll !!

Bin schon überhaupt nicht begeistert wieder mit Tabellen zu arbeiten, aber an dieser Stelle geht es nicht anders ;-) !!

Bestn Dank schon einmal für Euren Input !!

Gruß, curveball
 
Ansich wollte ich eben mal ... so "Quick & Dirty" das Problem mit Hilfe meines vereinfachten Markups verdeutlichen ... und siehe da es klappt sogar mit width: 100% !! :grin: ... war aber bevor ich hier noch den Post eröffnet hatte mein allererster Versuch mit der Breite gleich 100% und es hat mir tierisch das Layout zerschossen !!

Schei** saß heute bestimmt wieder zu lange vor der Liste !! ... und hab da irgendeinen dummen Fehler gemacht !! ... also nichts für ungut !!

Hier dennoch mal das Markup und es klappt !! :grin:


Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
 <title>Unbenannt</title>
</head>
<style>
*  {
  margin: 0px;
  padding: 0px;
  }
#body {
  width: 100%;
  height: 100%;
  background-color: #00FF00;
  }
 
#left {
  width: 200px;
  height: 100%;
  float: left;
  background-color: #FFF000;
  }
 
#right {
  width: 200px;
  height: 100%;
  float: right;
  background-color: #0000FF;
  }
 
#center {
  padding: 0px 220px 0px 220px;
  background-color: #00FFCC;
  }
 
#container  {
    height: 500px;
    background-color: #FF0000;
    }
table.problem {
    width: 100%;
    border: 1px #000000 solid;
    }
 
</style>
<body>
<div id="body">
  <div id="left">LEFT</div>
 
  <div id="right">RIGHT</div>
 
  <div id="center">
 
    <div id="container">
      <table class="problem">
      <tr>
       <td>Cell 1</td>
       <td>Cell 2</td>
      </tr>
      <tr>
       <td>Cell 1</td>
       <td>Cell 2</td>
      </tr>
      </table>    
    </div>
 
  </div>
</div>
 
</body>
</html>
 
Die Tabelle befindet sich in einem div-Container
Nur die Tabelle? Warum packst Du die Tabelle dann in ein Element, das zum Gruppieren mehrerer Elemente dient? Dann kannst Du das <div> auch einfach weglassen, ist nämlich unnützer Code, der den Traffic erhöht und Deinen Code unübersichtlich macht und Dich zu div-Suppe animiert. div und table sind beides Block-Elemente, sie verhalten sich also gleich.

Bin schon überhaupt nicht begeistert wieder mit Tabellen zu arbeiten, aber an dieser Stelle geht es nicht anders ;-) !!
Tabellen sind doch nicht böse! Tabellen sind die einzige Möglichkeit, tabellarische Daten richtig auszuzeichnen. Wenn Du keine tabellarischen Daten hast, dann geht es natürlich anders, in dem Fall gibt es keinen Grund, Tabellen zu nutzen.

Gruß,
-Efchen
 
Wie gesagt, das Beispiel sollte nur als Quick & Dirty gemeint sein !!

In dem ensprechenden DIV-Container befinden sich noch andere Elemente ... somit schon sinnvoll diese in ein DIV zu packen !!

Was die Tabellen anbetrifft, hab ich diese früher zum Layouten missbraucht ... nun ja ... waren alle mal jüng ;-) ... und irgendwann hat mich der damit verbundene Code einfach erschlagen und ich habe nichts mehr richtig wieder gefunden ;-) !!! ... also nur noch Tabellen da wo sie wirklich nützlich sein können !!

Gruß, curveball
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben