Kuhgesicht: Tabelle im Browser zentriert darstellen

SELF-Forum

Tabelle im Browser zentriert darstellen

Kuhgesicht
– Informationen zu den Bewertungsregeln

Hi!
Ich habe eine HP mit einer Tabelle (3 Spalten) erstellt. Im linken und rechten ist nur Design, im mittleren der Inhalt! Wenn man die Seite öffnet, soll sich der mittlere Tabellenteil im Browser zentrieren, wobei die linke und rechte Spalte kleiner, bzw. schmaler werden soll, so das der eigentliche Teil der HP immer in der Mitte des Brwoserfensters zu sehen ist! Wie geht sowas? Kann mir da bitte jemand helfen?

Hier mal die Seite mit der ich die Probleme habe:
http://mitglied.lycos.de/kuhgesicht/design.htm

Danke

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Tabelle im Browser zentriert darstellen

    Sven Schrodt
    – Informationen zu den Bewertungsregeln

    Hallo (Kuhgesicht?? ???)!

    jetzt habe ich mal eine Frage: wenn du einen Teilchenbeschleuniger gebaut hast, diesen per UPS an den Auftraggeber sendest und das Fabrikat dort nicht wie erwartet funktioniert - würdest du dann einen Artikel in der Bildzeitung publizieren wollen, mit der Überschrift "Logistik-Unternehmer versagt völlig..." ?

    Ich hoffe es ist klar, was ich meine: das Protokoll "http" hat nun _wirklich nichts_! mit dem von dir erstellten HTML-Quelltext zu tun - es befördert diesen nur ...

    Zu deinem Problem : ich verstehe das nicht ganz -  erkläre es doch bitte nochmals!

    Gruss vom Niederrhein

    Sven Schrodt

    P.S: kennst du das: http://selfhtml.teamone.de/html/index.htm?

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  2. Zentriertes flexibles Layout, Bilder an den Seiten

    molily Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo, Kuhgesicht,

    Ich habe eine HP mit einer Tabelle (3 Spalten) erstellt. Im linken und rechten ist nur Design

    Das heißt: Grafiken mit fester Breite.

    im mittleren der Inhalt!

    Das heißt: ein Grafik mit fester Breite bzw. ein Inner Frame mit fester Breite.

    Daraus kann man schließen, dass eine Grafik neben der anderen steht und alle drei haben eine feste Breite, ergo sind sie immer gleich breit...

    Wenn man die Seite öffnet, soll sich der mittlere Tabellenteil im Browser zentrieren, wobei die linke und rechte Spalte kleiner, bzw. schmaler werden soll, so das der eigentliche Teil der HP immer in der Mitte des Brwoserfensters zu sehen ist! Wie geht sowas?

    Hmm... eigentlich sollte so etwas folgendermaßen lösbar sein:

    <table style="width:100%;" summary="Layouttabelle">
    <tr>
    <td style="background-image:url(Neue-HP001_01.jpg);"></td>
    <td style="width:599px;">...Inhalt (Grafiken, dann Iframe)...</td>
    <td style="background-image:url(Neue-HP001_03.jpg);"></td>
    </tr>
    </table>

    Das kannst du ja einmal umsetzen.
    Komischerweise lässt sich Opera nicht dazu überreden, die linke und rechte Spalte gleichgroß anzuzeigen und die mittlere zu zentrieren.
    Müsste aber gehen... ich habe noch nie ein Tabellenlayout für Opera erstellt ;), vielleicht hat jemand einen Tipp. Folgendes geht auch nicht:
    <colgroup>
    <col width="*">
    <col width="599">
    <col width="*">
    </colgroup>
    Opera kennt anscheinend diese Elemente gar nicht, also ist die Wirkungslosigkeit voraussehbar.

    Ich würde sowieso deine komplette Seite verwerfen und neustrukturieren, bspw. sind die vielen Tabellenzeilen und die oberste und die unterste Grafik unnütz, und den Rahmen kannst du mit CSS machen, deine Grafiken müsstest du entsprechend anpassen. Der Quellcode ist, mit Verlaub, unter aller Sau... standardkonformer Code oder naheliegender überhaupt Etwas, was zumindest ein wenig wie HTML aussieht, wäre von Nöten.

    Hier einmal eine einfache Version, wie man es mit CSS realisieren könnte:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
    <head>
    <title>Kuhgesicht</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <style type="text/css" title="Autorenstylesheet">
    /* ...hier Styles für NS4 und Konsorten einsetzen... */
    @media screen {
    html, body {margin:0; padding:0; background-color:#02113a;}
    img {margin:0; padding:0; border:0;}
    iframe {border:0;}
    #middle {width:599px; margin-left:auto; margin-right:auto; margin-top:0; margin-bottom:0; padding:14px 0 60px 0; color:inherit; background-color:#02113a; position:relative; z-index:1;}
    #left, #right, #middle {border:1px solid #000;}
    #middle div {margin:0; padding:0;}
    #left {position:absolute; top:0; left:0; width:212px; height:768px;}
    #right {position:absolute; top:0; right:0; width:213px; height:768px;}
    }
    </style>
    </head>
    <body>

    <div id="left"><img src="Neue-HP001_01.jpg" alt="" /></div>
    <div id="right"><img src="Neue-HP001_03.jpg" alt="" /></div>

    <div id="middle">
    <div><img src="Neue-HP001_04.jpg" alt="[Kuhgesicht]" /></div>
    <div><img src="Neue-HP001_05.gif" alt="[Navigation]" /></div>
    <iframe src="test.htm" height="592" width="599" frameborder="0"><a href="text.htm">Zur Seite</a></iframe>
    </div>

    </body>
    </html>

    Viel Spaß beim Werkeln.

    Grüße,
    Mathias

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln