Christian Rost: XHTML Frames mit CSS

Hallo alle miteinander,
da man ja bein XHTML keine Frames mehr benutzen sollte oder darf, stell ich jetzt mal folgende Frage.

Wie kann ich so was ähnliches realisieren, mit CSS. Soll eine Art Menü werden.

  1. Hallo alle miteinander,
    da man ja bein XHTML keine Frames mehr benutzen sollte oder darf, stell ich jetzt mal folgende Frage.

    Wie kann ich so was ähnliches realisieren, mit CSS. Soll eine Art Menü werden.

    Hallo, hier ein kleines Beispiel:

    HTML:
    <div class="nav">
     <ul class="nav">
      <li><a href="seite1.html">seite1</a></li>
      <li><a href="seite2.html">seite2</a></li>
     </ul>
    </div>
    <div class="content">
     <h1>Hallo</h1>
    </div>

    CSS:
    div.nav{
     position: absolute;
     top:o;
     left:0;
    }
    div.content{
     position: absolute;
     top:o;
     left:100px;
    }

    Alternativ kann man natürlich auch auf das <ul> umschließende
    <div> verzichten und anstelle dessen die <ul> positionieren.

    Ein kleines Beispiel eines aktuellen Projektes, an dem ich gerade rumfrickel: www.oldschool.de mit der css unter www.oldschool.de/screen.css und old_ie.css

    Schöne Grüße,
    Ben

    1. Das heißt das ich bei jeder neuen Seite die ich aufruf das Menu wieder schreiben muß oder kann man das anders lösen?

      1. Das heißt das ich bei jeder neuen Seite die ich aufruf das Menu wieder schreiben muß oder kann man das anders lösen?

        Das heißt es, aber das ist doch nicht schlimm? Es gibt ja auch serverseitige Techniken, die einem das abnehmen. Stichwort CMS ...

        An Benjamin: irgendwie leidet der Code auch an "Klassitis", wenn ich mal Zeldman gebrauchen darf: für den Div wäre ein "id" besser geeignet als "class", denn das Ding kommt ja sicherlich nur einmal pro Seite vor. Das innere <ul> braucht _gar keine_ Klasse oder ID ... es kann ja im CSS bequem über "#menu ul" angesprochen werden.

        Gruß,
        KonRad -

        --
        "Was Gott zusammengeführt hat ..." :: polithink.org -
        the politicultural e-zine :: http://www.polithink.org
        1. An Benjamin: irgendwie leidet der Code auch an "Klassitis", wenn ich mal Zeldman gebrauchen darf: für den Div wäre ein "id" besser geeignet als "class", denn das Ding kommt ja sicherlich nur einmal pro Seite vor. Das innere <ul> braucht _gar keine_ Klasse oder ID ... es kann ja im CSS bequem über "#menu ul" angesprochen werden.

          Recht hast Du, aber ich meine mich erinnern zu können mit irgendeinem
          Browser mal Schwierigkeiten mit id's gehabt zu haben und hab' mich
          irgendwann mal entschieden alles in class's zu packen,
          dann brauche ich auch nicht darauf achten das Element nur 1x
          pro Seite zu verwenden. Frag mich nicht mit welchem, vielleicht
          irre ich mich auch.
          Das <ul> brauchte eine class oder id,
          da ich später darauf hingewiesen habe, dass es auch ohne
          das umschließende <div> geht, beide gleichzeitig sind natürlich
          überflüssig.

          Grüße,

          Ben

          1. Danke erst mal für die vielen antworten.

            Kann mir vielleicht irgend jemand mal so eine Seite mit Quellcode zeigen. Wo das Menu fest ist oder wo man nur irgend was includen muß.

            Man(n) will ja seinen Wissensdurst stillen.

            Thx for Answer.

            1. Kann mir vielleicht irgend jemand mal so eine Seite mit Quellcode zeigen. Wo das Menu fest ist oder wo man nur irgend was includen muß.

              Viele Seiten sind so ... das sieht man denen ja nicht an (auch nicht im Quellcode, den man als Client zu Gesicht bekommt).

              Gruß,
              KonRad -

              --
              "Was Gott zusammengeführt hat ..." :: polithink.org -
              the politicultural e-zine :: http://www.polithink.org
              1. Da gibt es jetzt nur ein Problem, Serverseitige Script's werden nicht unterstütz. Waaaaaaaaaaaahhhhhhhhhh, was nun?

                1. Da gibt es jetzt nur ein Problem, Serverseitige Script's werden nicht unterstütz. Waaaaaaaaaaaahhhhhhhhhh, was nun?

                  Auf Ingos Tip mit Phase5 zurückgreifen, den Provider wechseln,
                  oder Dein Webspace-Packet zu dem nächsthöheren upgraden,
                  in dem das dann unterstützt wird, falls möglich.

                  Ben

                2. Da gibt es jetzt nur ein Problem, Serverseitige Script's werden nicht unterstütz. Waaaaaaaaaaaahhhhhhhhhh, was nun?

                  wie ich sagte: die Transformation offline vornehmen und dann die endgültige Version hochladen. Hat sogar einige Vorteile gegenüber der dynamischen Version: Performance.
                  Geht natürlich nur bei eigentlich statischen Inhalten.

                  Gruß,
                  KonRad -

                  --
                  "Was Gott zusammengeführt hat ..." :: polithink.org -
                  the politicultural e-zine :: http://www.polithink.org
                  1. Hallo.

                    Geht natürlich nur bei eigentlich statischen Inhalten.

                    Na, die wird er wohl haben, wenn schon bisher nichts anderes möglich war.
                    MfG, at

            2. Hi,

              Kann mir vielleicht irgend jemand mal so eine Seite mit Quellcode zeigen. Wo das Menu fest ist oder wo man nur irgend was includen muß.

              Du mußt nur das Prinzip verstehen: Das was bei Dir als Besucher herauskommt, ist in diesen Fällen immer eine komplette HTML-Seite, in der das Menü stets gleich vorhanden ist.
              Um dies zu erreichen, brauchst Du zunächst noch nicht einmal besondere Technologien. Es reicht bereits, wenn Du - nachdem Du Deine erste Seite erstellt und gespeichert hast - hier den Inhaltsbereich löscht und den Rest mit der Navigation als Vorlage speicherst, in die Du dann die jeweiligen Inhalte der einzelnen Seiten schreibst.

              Nachträgliche Änderungen am Menü kann man zur Not auch mit Programmen, die eine dateiweite Suchen/Ersetzen-Funktion haben, hierüber erledigen.
              Besser ist es hingegen, dies von vorne herein einzukalkulieren und eine INCLUDE-Funktion zu verwenden.
              Dies geht zum einen über serverseitige Lösungen wie PHP oder SSI, die ja bereits angesprochen sind, zum anderen unterstützen dies aber auch einige Editoren. In Phase 5 z.B. kann ich den Menübereich in spezielle HTML-Kommentare
              <!--INC:"menu.inc"--> <!--/INC:"menu.inc"-->
              setzen, die der Editor bei der Funktion "includes aktualisieren" verwendet und automatisch in jeder Datei den Inhalt, der zwischen diesen Kommentaren steht, gegen den Inhalt der dort angegebenen Datei austauscht.

              Diese editorseitige Include-Lösung hat eigentlich nur den Nachteil, daß hinterher sämtliche Dateien auf den Server übertragen werden müssen und der Speicherplatt auf dem Server natürlich - wenn auch meist nur geringfügig - stärker belastet wird. Der Besucher merkt dagegen keinen Unterschied, außer daß im Fall von serverseitigem Include die Auslieferung der Datei bei entsprechender Auslastung etwas länger dauern kann...

              freundliche Grüße
              Ingo

      2. Das heißt das ich bei jeder neuen Seite die ich aufruf das Menu wieder schreiben muß oder kann man das anders lösen?

        Ich löse sowas mit einem PHP-Script:

        index.php : erstellt mir das HTML Grundgerüst und
        includiert (einbinden) navigation.php und seite.inc

        navigation.php : baut die navigation auf

        seite.inc : der inhalt der jeweiligen seite, der nacher in das <div class="content"> geladen wird.

        Das ist aber für den Anfang etwas kompliziert,
        versuche es vielleicht erstmal mit SSI (server side includes):

        jede seite seite.shtml hat im <div class="navigation">
        eine include zeile, die dann die navigation.inc oder navigation.html
        hinzufügt (serverseitig)

        Hoffe geholfen zu haben,

        Ben

  2. da man ja bein XHTML keine Frames mehr benutzen sollte oder darf, stell ich jetzt mal folgende Frage.

    Man darf schon. XHTML 1.0 hat einen Frameset-Variante und XHTML Modularization ein entsprechendes Modul.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Ich bin ein XHTML 1.0-Frameset.</title>
    </head>
    <frameset cols="25%,75%">
    <frame name="bla1" src="bla1.html" />
    <frame name="bla2" src="bla2.html" />
    <noframes>
    <body>
    <h1>Ich bin ein XHTML 1.0-Frameset.</h1>
    ...
    </body>
    </noframes>
    </frameset>
    </html>