Verschachtelung von div-Containern?

P

Pixelprofi

Aktives Mitglied
Thread Starter
Dabei seit
08.11.2002
Beiträge
420
Reaktionspunkte
2
Hallo werte Macuser,

bin gerade dabei eine barrierefreie Website zu erstellen, dabei möchte/muss ich folglich komplett auf Tabellen verzichten und stattdessen div-Container verwenden. Könnt Ihr mir sagen wie ich div-Container verschachteln kann?

Folgendes Beispiel in Tabellen (ein 3-spaltiges Layout):

<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>

Wie erstelle ich dieses Layout mit Hife von div-Containern?

Vielen Dank für Eure Hilfe!
Kennt Ihr auch zufällig eine gute Website, welche sich mit der Erstellung barrierefreier Websiten befasst?

Grüße
Pixelprofi
 
Ich finde es toll, daß es immer mehr Leute gibt, die sich über barrierefreie Seiten Gedanken machen und auch bereit sind, das umzusetzen. Informationen sollten schließlich für alle zugänglich sein!
Aber ganz soll man bei barrierefreien Seiten nicht auf Tabellen verzichten – Man soll sie nur nicht für Gestaltungszwecke mißbrauchen. Tabellarische Daten sollen nachwievor in einer Tabelle untergebracht werden.
Eine spontane Suche mit Google brachte allerdings u. a. diese und jene Seite zum Vorschein. Viel Spaß beim Basteln!
 
Zuletzt bearbeitet von einem Moderator:
leider gibt es zu diesem thema viel zu wenig gute webseiten, insbesondere zu css (oder ich kenne sie leider noch nicht). wenn du dein drei spaltiges design umsetzen möchtest kommst du um css nicht herum. grundsätzlich würde dein code dann z.b. ganz vereinfacht so aussehen:

<body>
<div id="linkespalte">
</div>
<div id="mittlerespalte">
</div>
<div id="rechtespalte>
</div>
</body>

in einer css-datei müssen dann noch die eigenschaften des div ids angegeben werden. das bsp. ist aber sehr starkt vereinfacht. vlt helfen dir folgende webseiten weiter:

style-sheets.de/
Einführung in CSS
barrierefreies-webdesign

viel erfolg
 
nuz:y schrieb:
leider gibt es zu diesem thema viel zu wenig gute webseiten, insbesondere zu css (oder ich kenne sie leider noch nicht). wenn du dein drei spaltiges design umsetzen möchtest kommst du um css nicht herum. grundsätzlich würde dein code dann z.b. ganz vereinfacht so aussehen:

<body>
<div id="linkespalte">
</div>
<div id="mittlerespalte">
</div>
<div id="rechtespalte>
</div>
</body>

in einer css-datei müssen dann noch die eigenschaften des div ids angegeben werden. das bsp. ist aber sehr starkt vereinfacht. vlt helfen dir folgende webseiten weiter:

style-sheets.de/
Einführung in CSS
barrierefreies-webdesign

viel erfolg
Zum Vergrößern anklicken....

Euch beiden schon einmal vielen Dank!
Wenn ich die div-Container so umsetzte wie von Dir angegeben, dann erscheinen sie doch aber untereinander. Wie bekomme ich sie denn nebeneinander?

Gerne auch mit CSS (geht auch schlecht ohne) ;)

Nochmals vielen Dank!
 
Was hast Du gegen Tabellen??

<table>
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
</tr>
</table>

wird zu:
<div id="Layer1" style="position: absolute; left: 12px; top: 15px; width: 7px; height: 19px; z-index: 1">a</div>
<div id="Layer2" style="position: absolute; left: 23px; top: 15px; width: 8px; height: 19px; z-index: 2">b</div>
<div id="Layer3" style="position: absolute; left: 35px; top: 15px; width: 7px; height: 19px; z-index: 3">c</div>

Geht mit Dreamweaver 4 ganz einfach...
(Modifizieren-Konvertieren-Tabelle in Ebenen)

Aber wozu???
 
die positionierung erfolgt über css. in der seite oder extern, wobei eine externe datei die schönere variante ist. die css datei könnte dann z.b. wie folgt aussehen:

#linkespalte {
position: absolute;
left: 10px;
top: 10px;
width: 200px;
}
#rechtespalte {
position: absolute;
right: 10px;
top: 10px;
width: 200px;
}
#mittlerespalte {
margin-left: 220px;
margin-right: 220px;
}

für weitere fragen würde ich dir dann dringend entsprechende literaur empfehlen ;-)
 
HäckMäc schrieb:
[ CSS-Gemurkse ]

Geht mit Dreamweaver 4 ganz einfach...
(Modifizieren-Konvertieren-Tabelle in Ebenen)
Zum Vergrößern anklicken....

*Hualp* Super Teil, dieses Dreamweaver.
 
Vielen Dank an Euch allen!

Ihr konntet mir weiterhelfen und ich habe keine weiteren Fragen :)

Viele Grüße
Pixelprofi
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben Unten