[CSS] Problemchen mit tabellenlosem layout

[Meflin]

hi miteinander,

ich will meine neue projektwebseite entsprechend der heutigen richtlinien ohne tableen gestalten. bin ihc bis jetzt auch ziemlich gut damit zurechtgekommen, nur jetzt ergibt sich mir folgendes problem:

ich habe datensätze, die ich in einer übersicht ausgeben will, jeder datensatz eine zeile, wie immer ;) dabei steht links die nummer, dann folgt der titel, dann das datum usw.

nur: wenn ich das mit einer tabelle mache, ist das kein problem, jede information bekommt in der zeile ihre eigene spalte, sodass am ende alles schön untereinender steht: jeder name unter jedem name, jedes datum unter jedem datum.

nur wie mache ich sowas nun mit css? bis jetzt kann ich nur einfach alle daten hintereinanderhängen, was aber zwangsläufig zu einem heillosen chaos führt, da ja nicht alle daten gleich lang sind :(

ich hoffe ihr versteht was ich meine

[yankee]

öhm, es hieß man soll keine Tabellen zur Seitengestaltung benutzen, nicht, man soll GARKEINE Tabellen benutzen. Genau für sowas sind doch tabellen da...
Alternativ könntest du eine Tabelle aus einer XML-Datei heraus erstellen, das geht auch einfach mit HTML... Aber css ist dafür da um allgeimeine Designregeln festzulegen (Hintergrundfrabe, Schriftgröen, Breiten von Tabellenspalten,...........) aber jedenfalls nicht für Daten.

Also entweder ich verstehe dich gerade völlig falsch, oder du machst igrnedwas komisch...

[Meflin]

Zitat:

Zitat von yankee

öhm, es hieß man soll keine Tabellen zur Seitengestaltung benutzen, nicht, man soll GARKEINE Tabellen benutzen. Genau für sowas sind doch tabellen da...
Alternativ könntest du eine Tabelle aus einer XML-Datei heraus erstellen, das geht auch einfach mit HTML... Aber css ist dafür da um allgeimeine Designregeln festzulegen (Hintergrundfrabe, Schriftgröen, Breiten von Tabellenspalten,...........) aber jedenfalls nicht für Daten.

ich weis nicht genau was du damit sagen willst, jedenfalls kommen die daten natürlich nicht aus der css datei, sondern aus einer mysql datenbank ;) sie sollen nur nicht mithilfe von tabellen formatiert werden, sondern eben... ohne :) das muss doch möglich sein...

[moritz]

Naja, eine Tabelle besteht ja im Prinzip auch nur aus vielen einzelnen Boxen. Die kannst du mit CSS auch leicht machen. Wo liegt dein Problem? :gruebel:

[yankee]

Zitat:

Zitat von Meflin

sie sollen nur nicht mithilfe von tabellen formatiert werden, sondern eben... ohne :) das muss doch möglich sein...

Naja, du könntest natürlich schon einfach divs nehmen, die nebeneinader plazieren (mit CSS) und da die Inhalte reinschreiben. Aber Tabellen sind genau für diesen Zweck erfunden wurden. Daher habe ich Probleme nachzuvollziehen, wieso man keine Tabellen benutzen soll... Aber meinetwegen:
+--------+--------+--------+
| DIV1 | DIV2 | DIV3 |
+--------+--------+--------+
Div1 ist Spalte 1, Div2 ist Spalte 2,..
div1: <div style="position: absolute; top:0px; left:0px; width=100px;">
Zeile1
Zeile2
..
</div>
DIV2:
<div style="position: absolute; top:0px; left:100px; width=100px;">
Zeile1
Zeile2
..
</div>
DIV3:
...

So würde es gehen. Aber du kannst kaum relative "Spalten"-breiten benutzen. Auch das mit der MySQL-Anbindung ist doof, weil du ja wahrscheinlich nicht Spalte für Saplte durchgehst (wie es bei dieser Methode angebracht wäre) sondern Datensatz für Datensatz.
Ansonsten ist die Tabelle im Schreibmaschienenstil (wie ich oben gerade vorgeführt habe) auch eine Alternative. Aber mal abgesehen davon ist das nicht nur schwerer zu proggen, sondern für Vorlesegeräte bestimmt auch ganz schwer auszuwerten. Also, warum willst du keine Tabellen verwenden?

[idontwantaname]

wieso darf bzw. soll man keine tabellen zur seitengestaltung verwenden ??
ich kann mir das nämlich nicht ganz so gut vorstellen, ohne tabellen eine seite zu gestalten, denn ich finde dafür sind tabellen ganz gut zu gebrauchen, und jedes forum verwendet tabellen, und foren werden sicherlich auch nicht ohne auskommen

[yankee]

Zitat:

Zitat von idontwantaname

wieso darf bzw. soll man keine tabellen zur seitengestaltung verwenden ??
ich kann mir das nämlich nicht ganz so gut vorstellen, ohne tabellen eine seite zu gestalten, denn ich finde dafür sind tabellen ganz gut zu gebrauchen, und jedes forum verwendet tabellen, und foren werden sicherlich auch nicht ohne auskommen

Weil man normalerweise versucht eine Internetseite Behindertengerecht zu gestalten. Laut Statistik ist der Anteil der Behinderten die das Internet nutzen viel größer, als der der gesunden....
Wie auch immer, man muss ja nicht nur nach der Statistik seine Seite designen, ein Kunde ist ein Kunde, ist ein Kunde...
Sehbehinderte verwenden zum Lesen von Webseiten geräte, die den Text vorlesen. Tabellen können diese Lesegeräte verwirren. Und weil man mit divs alles, was mit tabellen geht auch machen knn, nur noch viel mehr, das ganze im qt übersichtlicher ist,... nimmt man zur Seitengestaltung divs.
PHPBB setzt noch auf Tabellen und die meisten Foren setzen auf PHPbb, daher setzen die meisten Foren auf Tabellen. Das war sicherlich viel Arbeit die ganzen tabellen richtig zu positionieren und offensichtlich hatte noch keiner Lust sich hinzusetzen, um alles zu ändern (never change a running system...). Aber technisch wäre es wirklich kein Problem dabei auf tabellen zu verzichten.
Aber Tabllen sind eben dafür dar Werte schon darzustellen. Und dafür darf man sie auch gewissenhaft nutzen (auch Lesegeräte versuchen Tabellen so vorzulesen, dass sie in DIESEM Bezug einen Sinn ergeben).

Zusatzinfo: http://de.selfhtml.org/css/eigenscha...m#speak_header

[idontwantaname]

na, da hab ich wieder was neues dazugelernt :mrgreen:

trotzdem denke ich, dass man tabellen nicht so einfach durch divs ersetzen kann, da das richtige positionieren nur durch position:absolute erreicht werden kann, oder irre ich mich da ??
jedenfalls denke ich, das man mit seiner seitengestaltung durch verwendung von tabellen statt divs ein wesentlich leichteres spiel hat

[edit] immer diese tippfehlre :mrgreen:

[mh166]

Also ich denke das kommt darauf an, wie mans gewöhnt ist. Aber wenn man sich erst mal ein bisschen mit <div>s beschäftigt hat, möchte man sie nicht mehr missen! Dadurch spart man sich auch einen ganz schönen Overhead, der sonst beim Laden der Seite allein für die Tabellendefinitionen drauf geht!

Ehrlich gesagt: ich war am Anfang genauso skeptisch, wie idontwantaname. Aber ich hab mich hingesetzt und ein bisschen rumprobiert. Da kommt man relativ schnell hinter, wie man was anordnen muss, damits funktioniert. Und wenn mans hat isses einfach wartungsfreundlicher, übersichtlicher und vor allem viel kleiner als mit Tabellen!

Von daher kann ich <div>s nur empfehlen, auch wenns n bissel Einarbeitungszeit kostet.

mfg, mh166

[moritz]

Der Vorteil an Layern ist, dass man keine Inline-Definitionen braucht, sondern diese in ein extrenes Stylesheet auslagern kann.
Dadurch erreicht man eine vollkommene Trennung von Inhalt und Layout. Und genau dass ist es, auf dass die ganze XHTML-Sache rauslaufen soll.

[Luckie]

Trotzdem ist es Quatsch bei einem tabellarischen Inhalt auf teufel komm raus auf Tabellen verzichten zu wollen. Dafür sind Tabellen da und dafür sollten sie auch genutzt werden.

[Meflin]

Zitat:

Zitat von Luckie

Trotzdem ist es Quatsch bei einem tabellarischen Inhalt auf teufel komm raus auf Tabellen verzichten zu wollen. Dafür sind Tabellen da und dafür sollten sie auch genutzt werden.

nur dass wenn ich in meinem total tabellenlosen layout eine tabelle einbaue plötzlich das gesamte layout durcheinandergerät, ohne dass ich die tabelle irgendwie formatiert hätte :( ka wieso... werd mal ein bisschen rumexperimentieren...

[SubData]

Man soll Tabellen nur benutzen um tabellarischen Inhalt darzustellen und nicht um damit Seiten zu designen. So ist diese Aussage gemeint.

Beispiel:

Statistik:

Code:

|   Hits   |   Heute  |  Gestern |  Morgen  |
|          |      20  |      100 |        0 |

Dafür darf man Tabellen verwenden.

Hierfür NICHT:

Code:

|------------------------------|
|   Navi   |      Seiteninhalt |
|------------------------------|
|      Footer                  |
|------------------------------|

Dafür sollte man Divs verwenden.

[Meflin]

ich weis wie luckies aussage gemeint war ;) ich meinte auch nicht ich würde mein layout verändern, das tue ich in keinster weise. wenn ihc aber eine tabelle als inhalt einfüge, dann ist mein layout im arsch. verstanden? ich füge einfach eine tabelle als inhalt ein, und plötzlich wird nichts mehr so angezeigt wie es angezeigt werden sollte :?

[Luckie]

Ich denke, das haben wir alle verstanden. Nur was erwartets du jetzt von uns? Sollen wir raten wie dein Code aussieht und hellsehen, wie du es haben willst und wie es stattdessen aussieht?

[Meflin]

Zitat:

Zitat von Luckie

Ich denke, das haben wir alle verstanden. Nur was erwartets du jetzt von uns? Sollen wir raten wie dein Code aussieht und hellsehen, wie du es haben willst und wie es stattdessen aussieht?

das denke ich nicht, sonst hätte sich subdata ja seinen post sparen können :roll:

1. ist der code viel zu lang zum posten - allein das stylesheet sind ein paar hundert zeilen -
2. sagte ich bereits ich werde wohl ein wenig experimentieren müssen, da tabellen absolut keine lösung zu sein scheinen.
3. wer trotzdem helfen will: ein konkretes codebeispiel um eine derartige textformatierung zu erreichen wäre hilfreich, o.g. funzt auch net so wirklich

Code:

<div style="position: absolute; top:0px; left:0px; width=100px;">

führt dazu das der text irgendwo mitten in der webseite platziert wird, aber nicht da wo er hinsoll ;)

edit: ach ja, und der code ist bis jetzt zu 100% valides html und css.

[SubData]

Zitat:

Zitat von Meflin

das denke ich nicht, sonst hätte sich subdata ja seinen post sparen können :roll:

Der Post war garnich an dich gerichtet sondern ganz allgemein in die Runde geworfen...

[generic]

ich würde nur nicht das design / layout mit tabellen machen - da diese sich nicht gut mit screenreadern lesen lassen.

allerdings wenn du daten darstellen willst solltest du eine tabelle nehmen.

[Meflin]

Zitat:

Zitat von generic

ich würde nur nicht das design / layout mit tabellen machen - da diese sich nicht gut mit screenreadern lesen lassen.

allerdings wenn du daten darstellen willst solltest du eine tabelle nehmen.

wie schon gesagt, das geht nicht... damit sich jeder das problem vorstellen kann, anbei ein paar screenies

edit: ich merke gerade, die fehldarstellung mit der tabelle passiert nur im ie... in firefox gehts wunderbar *iehass*