Benutzerdefinierte Suche

Verschachtelung von div-Containern?

  1. Pixelprofi

    Pixelprofi Thread StarterMacUser Mitglied

    Mitglied seit:
    08.11.2002
    Beiträge:
    410
    Zustimmungen:
    1
    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
     
    Pixelprofi, 18.05.2005
  2. Ulfrinn

    UlfrinnMacUser Mitglied

    Mitglied seit:
    30.01.2005
    Beiträge:
    6.684
    Zustimmungen:
    588
    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!
     
    Ulfrinn, 18.05.2005
  3. nuz:y

    nuz:yMacUser Mitglied

    Mitglied seit:
    28.01.2005
    Beiträge:
    190
    Zustimmungen:
    3
    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, 18.05.2005
  4. Pixelprofi

    Pixelprofi Thread StarterMacUser Mitglied

    Mitglied seit:
    08.11.2002
    Beiträge:
    410
    Zustimmungen:
    1
    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!
     
    Pixelprofi, 18.05.2005
  5. HäckMäc_2

    HäckMäc_2MacUser Mitglied

    Mitglied seit:
    26.04.2005
    Beiträge:
    4.208
    Zustimmungen:
    288
    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???
     
    HäckMäc_2, 18.05.2005
  6. nuz:y

    nuz:yMacUser Mitglied

    Mitglied seit:
    28.01.2005
    Beiträge:
    190
    Zustimmungen:
    3
    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 ;-)
     
    nuz:y, 18.05.2005
  7. Nogger

    NoggerMacUser Mitglied

    Mitglied seit:
    03.08.2004
    Beiträge:
    367
    Zustimmungen:
    0
    *Hualp* Super Teil, dieses Dreamweaver.
     
    Nogger, 18.05.2005
  8. Nogger

    NoggerMacUser Mitglied

    Mitglied seit:
    03.08.2004
    Beiträge:
    367
    Zustimmungen:
    0
    Nogger, 18.05.2005
  9. Pixelprofi

    Pixelprofi Thread StarterMacUser Mitglied

    Mitglied seit:
    08.11.2002
    Beiträge:
    410
    Zustimmungen:
    1
    Vielen Dank an Euch allen!

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

    Viele Grüße
    Pixelprofi
     
    Pixelprofi, 19.05.2005
Die Seite wird geladen...
Ähnliche Themen - Verschachtelung div Containern
  1. mingorius
    Antworten:
    4
    Aufrufe:
    362
  2. Isegrim242
    Antworten:
    6
    Aufrufe:
    1.030
    Isegrim242
    23.08.2013
  3. apstalker
    Antworten:
    8
    Aufrufe:
    949
    apstalker
    26.11.2012
  4. Wobbomaster
    Antworten:
    1
    Aufrufe:
    1.306
    Wobbomaster
    23.06.2010
  5. MacManni2
    Antworten:
    4
    Aufrufe:
    1.070
    MacManni2
    14.05.2010