Netscape zeigt meine Seite nicht richtig an

[Hanno]

Hiho
Ich habe ein Problem mit folgender seite:
http://www.sfbshop.de/hilfe/templates/demo_template.html
Schaut sie euch mal an, aufm IE wird sie völlig korrekt angezeigt, auf dem Netscape völlig falsch.
Was habe ich falsch gemacht ?
Gruß
Hanno

[MudGuard]

Hi,

Ich habe ein Problem mit folgender seite:
http://www.sfbshop.de/hilfe/templates/demo_template.html
Schaut sie euch mal an, aufm IE wird sie völlig korrekt angezeigt, auf dem Netscape völlig falsch.

Ich werd doch nicht das Sicherheitsrisiko IE starten...

Was habe ich falsch gemacht ?

Du hast die FAQ (</faq/>) nicht gelesen, und daher keinen Link gesetzt.
Du hast nicht gesagt, welche Netscape-Version Probleme bereitet.
Du hast nicht gesagt, was falsch angezeigt wird.

Bist Du überhaupt sicher, daß der IE die Seite korrekt anzeigt? (Das, was Du für korrekt hältst, ist vielleicht falsch).

Hast Du die Seite validiert (CSS und HTML)?

cu,
Andreas

[Hanno]

Die Seite ist HTML 4.0 Transitional und es soll einfach oben links das bild Ihre Firma stehen, direkt rechts davon kommt die navigation und dann soll cin buffer kommen der bis 170px vor den rechten rand geht wo dann nochmal "BSS-Demoshop" kommt.
Gruß
Hanno

[SabineP]

Die Seite ist HTML 4.0 Transitional und es soll einfach oben links das bild Ihre Firma stehen, direkt rechts davon kommt die navigation und dann soll cin buffer kommen der bis 170px vor den rechten rand geht wo dann nochmal "BSS-Demoshop" kommt.
Gruß
Hanno

Hallo Hanno,

die Attribute für die Zellenhöhen sind erstmal falsch:
<td align="left" rowspan="2" height="110px">

so ist es richtig:
<td align="left" rowspan="2" height="110">

Komisch, daß der Validator dazu nichts sagt.

Gruß Sabine

[Hanno]

Nein daran liegt es auch nicht :(
Ich hab die seite jetzt geändert sodass ihr sehen könnt wie ich das mit dem border meine. Es ist wirklcih komisch. Wieso kann ein Borderwert die ganze tabelle verändern
Gruß
Hwnno

[SabineP]

Nein daran liegt es auch nicht :(

Ja, Du hast Recht. An der Darstellung ändert das erstmal nichts.
Aber Du kannst ja die Höhenangaben trotzdem korrigieren.

Dann würde ich noch sämtliche Style-Angaben im Body herausfischen
und im Head unterbringen.

vorher:
<td style="background-image:url(../pics/t_m_02.jpg)" align="left" valign="middle" width="320px" height="25px">

nachher:

.bild {background-image:url(../pics/t_m_02.jpg)}

<td class="bild" width="320" height="25">

Damit kommt der Netscape viel besser zurecht und auch Du,
wenn die Styles später einmal überarbeitet werden sollen.

Gruß Sabine

Gruß
Hwnno

[Hanno]

Aber es geht immernoch nicht :((
Das kann doch nich wahr sein, dass HTML keine Tabelle hinbekommt, die 3 definierte und eine abhängige Zelle hat ..
Gruß
Hanno

[MudGuard]

Hi,

die Attribute für die Zellenhöhen sind erstmal falsch:
<td align="left" rowspan="2" height="110px">
so ist es richtig:
<td align="left" rowspan="2" height="110">
Komisch, daß der Validator dazu nichts sagt.

Der sagt nichts wegen:

<!ATTLIST (TH|TD)                      -- header or data cell --
  %attrs;                              -- %coreattrs, %i18n, %events --
[...]
  height      %Length;       #IMPLIED  -- height for cell --
  >

<!ENTITY % Length "CDATA" -- nn for pixels or nn% for percentage length -->

Formal ist das Attribut als CDATA (also Zeichendaten) deklariert.
Die Einschränkung, daß es sich um eine (Pixel-) Anzahl handelt, steht nur im Kommentar.

"110px" ist ein gültiger CDATA-Wert.
Er genügt aber nicht der im Kommentar gemachten Einschränkung.

Bei DTDs gibt es relativ wengi Möglichkeiten, Werte formal einzuschränken.
Und der Validator kann nur den formalen Teil auswerten.

cu,
Andreas

[[gw] bigBENNE]

Hallo,

auf dem Netscape völlig falsch

Ich kann dir nur sagen, das ist nicht nur im Netscape so. Ich hab mir deine Seite jetzt mit folgenden Browsern angeschaut:

-Netscape 4.75
-Netscape 7
-IE 6.0
-Opera 6
-Mozilla 1.2
-Phoenix

Und der einzige Browser der scheinbar das richtige anzeigt, ist der IE - der Netscape 4.** zeigt nur Müll an (sieht man aber auf vielen Seiten) und beim Rest ist der Header immer gleich zerstückelt.

Außerdem scheint deine Doctype-Angabe falsch zu sein!

cu [gw] bigBENNE

[Ulki]

Was meinst du mit "falsch" ? Eigentlich stimmt ales, der Validator sagt auch nix.
Gruß
Hanno

[[gw] bigBENNE]

Hallo,
meinst du die Doctype-Angabe?

Also der W3C-Validator hat die Seite bei mir erst nach manueller Angabe der Doctype-Definition angezeigt.

Bei meiner HP sieht das so aus:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

cu [gw] bigBENNE

[Hanno]

Nein wenn ich auf die Seite gehe krieg ich folgenden code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
   <html>
      <head>
         <title>BSS-Demoshop</title>
         <meta name="author" content="Hanno Becker">
         <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
         <style type="text/css">
            a.t_l_link { text-decoration: underline; color: black }
            a.t_l_link:hover { text-decoration: underline; color: #FF9900 }
         </style>
      </head>

<body style="margin: 0px; font-family: Verdana">
         <map name="shop_agb_contact">
           <area alt="Shop" shape="rect" coords="100,26,140,60" href="<TMPL_VAR name='link_main'>">
           <area alt="Allgemeine Geschäftsbedingungen" shape="rect" coords="141,26,178,60" href="<TMPL_VAR name='link_agb'>">
           <area alt="Kontakt" shape="rect" coords="179,26,230,60" href="<TMPL_VAR name='link_kontakt'>">
         </map>
         <table cellpadding="0" cellspacing="0" style="border: 0px solid black" width="100%">
            <colgroup>
               <col width="155px">

<col width="320px">
               <col width="*">
               <col width="170px">
            </colgroup>
            <tr>
               <td align="left" rowspan="2" height="110px"><img alt="BSS-Demoshop" src="../pics/t_l_01.jpg"></td>
               <td align="left" height="85px"><img alt="BSs-Demoshop" border="0" usemap="#shop_agb_contact" src="../pics/t_m_01.jpg"></td>
               <td align="left" rowspan="2" height="110px" style="background-image:url(../pics/t_m_03.jpg)"></td>
               <td align="left" height="85px"><img alt="BSS-Demoshop" src="../pics/t_r_01.jpg"></td>

</tr>
            <tr>
               <td colspan="2" height="25px" style="background-image:url(../pics/t_m_02.jpg)" align="left" valign="middle">
                  <font size="1" face="Verdana" style="font-weight: bold; color: black">
                     <a href="expert_search.php" class="t_l_link">Suche:</a>
                  </font>
                  <input name="search" style="height: 14px; font-size: 8pt; border: 1px solid #000000">

<input type="image" src="../pics/t_m_los.jpg">

</td>
               <td height="25px" style="background-image: url(../pics/t_r_02.jpg)" align="left" valign="middle">
                  <font size="1" face="Verdana" style="font-weight: bold; color: #000000">
                     <a class="t_l_link" href="sdfsdf">Warenkorb</a> | <a class="t_l_link" href="asdfas">Mein Shop</a>
                  </font>
               </td>

</tr>
         </table>
      </body>
   </html>

uznd der doctype "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">" ist doch völlig ok

[Ulki]

Das dümmste ist dazu noch, dass es funktioniert, sobald ich den border auf 1 schalte. Dann wird alle richtig angezeigt. mit border="0" geht nichts mehr.
Gruß
Hanno

[Sven Rautenberg]

Moin!

uznd der doctype "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">" ist doch völlig ok

Jein.

Erstens gibt es einen kleinen Nachtrag im HTML-Standard auf Version 4.01, der gewisse Dinge korrigiert, die man in 4.0 vergessen hatte. Beispielsweise das name-Attribut in <img>. Benutze daher immer 4.01, wenn du deine Seiten validieren willst.

Zweitens: Es ist empfehlenswert, grundsätzlich die URL der DTD mit anzugeben. Die neuen Browser schalten dann üblicherweise in den Standard-Modus und rendern erst dadurch gewisse Dinge so, wie im Standard vorgesehen.

Eine Änderung des DOCTYPE ist also durchaus angebracht.

- Sven Rautenberg

[Hanno]

Danke, kannst du mir auch noch bei dem Problem der darstellung helfen ? Wäre echt super
Danke
Hanno

[Sven Rautenberg]

Moin!

Danke, kannst du mir auch noch bei dem Problem der darstellung helfen ? Wäre echt super

Ich habe ein wenig rumprobiert.

Grundsätzlich:

1. <colgroup> ist ja ganz nett, die Browser, die das tatsächlich umsetzen, müssen aber wohl noch gebaut werden. Also bringt dir die Breitendefinition (zumindest bei meinem Browser) dort herzlich wenig.

2. height ist genauso böse. Verwende es nicht! Es macht nur Probleme. Wenn du eine Tabellenzelle in der Höhe festlegen willst, verwende ein Bild. Beachte insbesondere, dass du Höhenangaben in der _ersten_ Zelle einer Zeile machen müßtest. Wenn du mit rowspan arbeitest, kannst du die erste Zelle der zweiten Zeile nicht mehr ansprechen und kriegst miese Ergebnisse.

3. Dass in HTML-Attributen die Angabe "px" nichts zu suchen hat, hat man dir wohl schon erklärt.

4. Das Mischen von Pixel-Angaben und relativen Angaben (%) in einer Tabelle geht in 100% aller Fälle schief. Wenn du einzelne Spalten pixelgenau festlegen willst, kannst du der Gesamttabelle nicht 100 _Prozent_ Breite geben. Was funktioniert, sind geschachtelte Tabellen.

Soweit mein Senf zu deinem Konstrukt - gewonnen aus einigen leidvollen Erfahrungen mit Tabellendesign (weswegen es auch den Tabellenzerleger auf meiner Seite gibt).

Wenn du dir die Dinge einfacher machen willst, verzichtest du auf Tabellen und legst ein vernünftiges CSS-Design an.

Ach ja, apropos CSS: Dein CSS vaporisiert im CSS-Validatior (http://jigsaw.w3.org/css-validator) zu Nichts, weil du in deinen Bezeichnern Unterstriche verwendet hast. Unterstriche sind sehr problematisch in Klassen- und ID-Namen, verwende einfach keine.

- Sven Rautenberg

[Hanno]

Was heisst das jetzt im Klartext für mich ?
Wie bekomme ich es hin, dass die Tabelle so breit wie das fenster ist und dennoch in 4 teile unterteilt ist, von denen 3 deifniert sind und einer sich anpassen soll ?
Gruß
Hanno

[Sven Rautenberg]

Moin!

Was heisst das jetzt im Klartext für mich ?
Wie bekomme ich es hin, dass die Tabelle so breit wie das fenster ist und dennoch in 4 teile unterteilt ist, von denen 3 deifniert sind und einer sich anpassen soll ?

Mindestens drei Tabellen machen: Eine übergreifende, und darin eine links und eine rechts.

- Sven Rautenberg

[Hanno]

Hilfe das verstehe ich absolut nicht :((
Gruß
Hanno <-- traurig

[Sven Rautenberg]

Moin!

Hilfe das verstehe ich absolut nicht :((

+--------------------------+-Tabelle außenrum------+--------------------------+
| +----tabelle links-----+ | +---Tabelle Mitte---+ | +----Tabelle rechts----+ |
| |                      | | |                   | | |                      | |
| +----------------------+ | +-------------------+ | +----------------------+ |
+--------------------------+-----------------------+--------------------------+

Wenn du die richtigen Tabellen in der Breite fixierst und andere offen läßt, kriegst du es sicherlich besser hin.

Nur so als Idee.

- Sven Rautenberg

[Hanno]

Halloi
Ich hab es jetzt so probiert:

<table border="0" cellpadding="0" cellspacing="0" width="100%" style="margin: 0px">
            <tr>
               <td>
                  <table border="0" cellspacing="0" cellpadding="0" width="155">
                     <tr>
                        <td><img alt="BSS-Demoshop" src="../pics/t_l_01.jpg"></td>
                     </tr>
                  </table>
               </td>
               <td>
                  <table border="0" cellspacing="0" cellpadding="0" width="320">
                     <tr>
                        <td><img alt="BSS-Demoshop" border="0" usemap="#shop_agb_contact" src="../pics/navigation.jpg"></td>
                     </tr>
                  </table>
               </td>
               <td>
                  <table border="0" cellspacing="0" cellpadding="0">
                     <tr>
                        <td class="top_buffer"></td>
                     </tr>
                  </table>
               </td>
               <td>
                  <table border="0" cellspacing="0" cellpadding="0" width="170">
                     <tr>
                        <td><img alt="BSS-Demoshop" src="../pics/right.jpg"></td>
                     </tr>
                  </table>
               </td>
            </tr>
         </table>

Aber es geht genauso schlecht wie vorher :((
Was ist denn falsch
Gruß
Hanno

[Sven Rautenberg]

Moin!

Ich hab es jetzt so probiert:

Aber es geht genauso schlecht wie vorher :((
Was ist denn falsch

Ich wollte meine Hinweise jetzt nicht als explizite Handlungsanweisung verstanden wissen. Aber gut: Analysieren wir, was du genau willst.

Du willst links und rechts zwei pixelfeste Bereich haben, und in der Mitte einen Bereich, der flexibel breit ist.

Deine Tabelle spiegelt diese Aufteilung schon wider. Allerdings wird sie vermutlich die anteilige Verteilung der Bereich nicht hingekriegt haben.

Es gibt einen in meinen Augen schmutzigen, aber legitimen Trick, das zu ändern:

<table width="100%">
<td width="1%"><td width="98%"><td width="1%">

Wenn du die äußere Tabelle mit diesen Breitenangaben versiehst und die inneren Tabellen mit Pixelbreiten, werden die inneren Tabellen die nur 1% breiten Spalten in der Breite erweitern, damit sie hineinpassen. Die Mitte wird entsprechend einfach kleiner.

Ansonsten solltest du dich wirklich mal mit CSS beschäftigen. Solche Positionierungsarbeiten sind damit wirklich schneller erledigt - auch und gerade bei dynamischem Seitenverhalten.

- Sven Rautenberg

[Hanno]

Hast du zu dem Thema ein gutes Tutorial ?
Gruß
Hanno

[Sven Rautenberg]

Moin!

Hast du zu dem Thema ein gutes Tutorial ?

Nein, ich hab noch keins geschrieben. Außerdem erachte ich die Notwendigkeit, Tabellen als Layouthilfsmittel einzusetzen, als immer geringer, weshalb ich mit 99% Sicherheit auch keins schreiben werde. :)

- Sven Rautenberg

[Hanno]

Wie soll ich es denn onst machen ohne tabellen ?
Gruß
Hanno

[Christian Seiler]

Hallo Hanno,

Wie soll ich es denn onst machen ohne tabellen ?

Schau Dir mal das hier an: http://css.fractatulum.net/

Viele Grüße,
Christian

[Christian Seiler]

Hallo Sven,

1. <colgroup> ist ja ganz nett, die Browser, die das tatsächlich umsetzen, müssen aber wohl noch gebaut werden. Also bringt dir die Breitendefinition (zumindest bei meinem Browser) dort herzlich wenig.

Welchen Browser verwendest Du? Bei mir funktioniert <colgroup> in Mozilla 1.4b, Opera 7.10 Beta 1 und Konqueror 3.1.1a; nur der Netsape 4 mag das nicht: http://www.christian-seiler.de/temp/test-col.html

Viele Grüße,
Christian

[MudGuard]

Hi,

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

4.01 wäre angebracht, und die URL sollte auch vorhanden sein.

<style type="text/css">
            a.t_l_link { text-decoration: underline; color: black }

Sehr riskant. Die Unterstriche in Identifiern wurden erst in den Errata zu CSS 2 eingefügt. Manche Browser haben aber CSS 2 ohne dieses Erratum implementiert und verkraften die Unterstriche nicht.

<body style="margin: 0px; font-family: Verdana">

Generische Schriftart fehlt.

<map name="shop_agb_contact">
           <area alt="Shop" shape="rect" coords="100,26,140,60" href="<TMPL_VAR name='link_main'>">

< in Attributwerten MUSS maskiert werden: <

<table cellpadding="0" cellspacing="0" style="border: 0px solid black" width="100%">
            <colgroup>
               <col width="155px">

px hat in HTML-Attributen nichts verloren.

<td colspan="2" height="25px" style="background-image:url(../pics/t_m_02.jpg)" align="left" valign="middle">
                  <font size="1" face="Verdana" style="font-weight: bold; color: black">

font sollte nicht mehr verwendet werden. Warum machst Du die Angaben nicht im style-Attribut des td?

<a href="expert_search.php" class="t_l_link">Suche:</a>

problematischer Klassenname, s.o.

<input name="search" style="height: 14px; font-size: 8pt; border: 1px solid #000000">

pt ist für Bildschirmausgabe immer noch keine geeignete Einheit.

<input type="image" src="../pics/t_m_los.jpg">

alt ist hier zwar nicht vorgeschrieben, die Verwendung ist dennoch erlaubt und auch sinnvoll.

cu,
Andreas

[Das Schaf]

Schaut sie euch mal an, aufm IE wird sie völlig korrekt angezeigt, auf dem Netscape völlig falsch.

Die sieht auch mit Mozilla einfach nur scheisse aus.

[Christian Seiler]

Hallo Hanno,

Ich habe ein Problem mit folgender seite:
http://www.sfbshop.de/hilfe/templates/demo_template.html

Ersetze:

<td align="left" rowspan="2" height="110" style="background-image: url(http://www.sfbshop.de/hilfe/pics/t_m_03.jpg);"></td>

Durch:

<td align="left" rowspan="2" height="110" style="background-image: url(http://www.sfbshop.de/hilfe/pics/t_m_03.jpg);"> </td>

Dann klappt es.

Viele Grüße,
Christian