Hallo, On 03-May-2004 Heinz W. Pahlke wrote:

On 03-May-2004 Karl Sinn wrote:

...

Im Mozilla ist die Navigationsleiste total zerschossen. Ich habe leider keine Ahnung wieso. Mozilla scheint die Zellhoehenangaben einfach zu uebersehen.

Tipps?

Validiere den Code <http://validator.w3.org/>, dann kann man weitersehen. So ist es ein reines Raten.

Und validiere auch gleich noch das css <http://jigsaw.w3.org/css-validator/validator-uri.html> Beste Gruesse, Heinz. -- http://www.pahlke-online.de/reisenews/ http://www.Pahlke-KunstWebDesign.de/

Hallo, On 03-May-2004 Dr. Thorsten Brandau wrote:

Mhh. Geht das denn mittlerweile besser? Ich habe vor ein paar monaten genau diesen Umstieg probiert, also alle Tabellen -> CSS konvertiert

Wie hast du denn das gemacht? Tabellen automatisch in divs konvertieren lassen, kann unmoeglich funktionieren. Und ware auch nicht sinnvoll. Gegen Tabellen fuer Tabelleninhalt ist ueberhaupt nichts einzuwenden, sondern nur gegen Layouttabellen.

mit gar schaurigem ergebnis. Jeder Browser zeigt was anderes an,

Das passiert aber genauso bei Tabellenlayouts, weil man einfach nicht wissen kann, mit welcher Bildschirmaufloesung jemand surft, mit welcher Browserfenstergroesse, mit welcher Schrift und welchen Mindestschriftgroessen.

spricht ja nichts, aber die tabellen sehe ich noch als absolutes muss,

Absolut ueberfluessig. Ich arbeite seit mindestens zwei Jahren ohne Layouttabellen, und es geht.

wenn die seiten auf verschiedenen browsern gleich aussehen sollen.

Pixelgenaues Layout und HTML passen aber nicht zusammen, weil du weder Ausgabegeraet noch Ausgabebedingungen kennst. Wie sehen deine Tabellenseiten z.B. in Lynx aus? So wie sie sich dort praesentieren, bekommt sie z.B. auch ein Nutzer von Braillezeile oder Sprachausgabe zu fuehlen bzw. zu hoeren. Ebenso wird sie von Suchmaschinen gesehen. Schau dir vielleicht mal http://www.kontakte-kontakty.de/ und http://www.buerger-engagement-fuer-ns-zwangsarbeiter.de/ an. Beide Seiten sind von Screenreader-Benutzern getestet und als sehr gut zugaenglich beurteilt worden. Und das ohne Tabellen. Beste Gruesse, Heinz. -- http://www.pahlke-online.de/reisenews/ http://www.Pahlke-KunstWebDesign.de/

Hallo, On 03-May-2004 Dr. Thorsten Brandau wrote:

...

Wie hast du denn das gemacht? Tabellen automatisch in divs konvertieren lassen, kann unmoeglich funktionieren. Und ware auch nicht sinnvoll.

nein, nicht automatisch. Ich habe die seiten neugeschrieben und versucht das layout gleich darzustellen. dann allerdings wollte ich

Tabellenlayouts mit divs nachzubauen, ist in der Tat schwierig. Ich habe es mit http://www.pahlke-online.de/ versucht, aber es war eine ziemliche Fummelei. Und Netscape 4.x und Konqueror kommen trotzdem noch nicht mit dem Formular bzw. dem folgenden Bahnlink klar.

das die menus statisch bleiben und nur der inhalt gescrollt wird (wie bei frames), dann wurde es haesslich.

Mit position:fixed kein Problem. Bloss der Internet Explorer kann es nicht :-(

ich habe meine tabellen immer mit relativen breiten versehen, so dass es (zumindest auf allen von mit getestetend browsern) gleich aussah.

Jedenfalls solange du auf Hintergrundbilder verzichtest. Sonst spielt der IE verrueckt.

...

Pixelgenaues Layout und HTML passen aber nicht zusammen, weil du weder Ausgabegeraet noch Ausgabebedingungen kennst. Wie sehen deine Tabellenseiten z.B. in Lynx aus? So wie sie sich dort praesentieren, bekommt sie z.B. auch ein Nutzer von Braillezeile oder Sprachausgabe zu fuehlen bzw. zu hoeren. Ebenso wird sie von Suchmaschinen gesehen.

Ich gebe zu, das ich die seiten nicht lynx-kompatibel erstelle.

Wie gesagt, es geht nicht um Lynx. Aber wie willst du sonst feststellen, wie deine Seite von Suchmaschinen gesehen wird? Wobei das natuerlich nur eine Rolle spielt, wenn Suchmaschinen fuer einen wichtig sind. Bei kommerziellen Seiten ist das bestimmt der Fall, bei privaten wohl eher nicht.

leider gibt es beim webseitenerstellen ungefaehr genauso viel glaubenskriege wie bei der wahl des betriebssystems, der programmiersprache etc. daher bitte die mail weder als den "heiligen gral" noch als kritik verstehen - fuer mich war CSS/XHTML (noch) nix.

Ich wuerde auch dem urspruenglichen Fragesteller nicht vorschlagen, auf Layouttabellen zu verzichten. Man muss sich eben doch gewaltig umstellen. Und fuer _einen_ kleinen Internetauftritt den Aufwand auf sich nehmen?

mein traum ist ja, openoffice dokumente in die seiten nahtlos zu integrieren, v.a. fuer interne seiten. wenn du mir da einen tipp geben kannst wie das geht, bin ich ja gerne bereit mich mit XHTML/CSS wieder zu beschaeftigen ;-)

Da es dir wohl nicht um Downloads geht, sondern um die Darstellung im Browser, bleibt dir da wohl nur xml. Aber damit habe ich mich bisher kaum ansatzweise beschaeftigt. Beste Gruesse, Heinz. -- http://www.pahlke-online.de/reisenews/ http://www.Pahlke-KunstWebDesign.de/

Hallo Heinz, hallo Thorsten, hallo Leute, Am Montag, 3. Mai 2004 12:42 schrieb Heinz W. Pahlke:

On 03-May-2004 Dr. Thorsten Brandau wrote: [...]

...

die menus statisch bleiben und nur der inhalt gescrollt wird (wie bei frames), dann wurde es haesslich.

Mit position:fixed kein Problem. Bloss der Internet Explorer kann es nicht :-(

Jedenfalls nicht ohne weiteres... Ich habe gerade ein Buch mit CSS-Tricks vor mir liegen, mit den richtigen Styles (und einem Extra-Stylesheet für IE) sollte es klappen. Ich habe das Ganze allerdings noch nicht getestet, kann also nur den Buchinhalt wiedergeben. Schritt 1: das passende Stylesheet einbinden. Die meisten Browser verwenden fixedmenue01.css, der IE >= 5.0 bekommt zusätzlich fixedmenuems.css zu sehen. (Die Art der Einbindung nennt sich übrigens "conditional comments" und ist eine MS-Eigenheit. Für alle anderen ist es ein ganz normaler Kommentar.) <link href="fixedmenue01.css" rel="stylesheet" type="text/css"> <!--[if gte IE 5]> <link href="fixedmenuems.css" rel="stylesheet" type="text/css"> <![endif]--> Der <body> sieht dann so aus: <body> <div id="menue"> feststehend </div> <div id="hintergrund"> <div id="inhalt"> scrollt weg </div> </div> </body> Dazu kommen noch die passenden Stylesheets. In fixedmenu01.css steht im Wesentlichen "positon:fixed;" für das Menü: #menue { position: fixed; left: 0px; top: 0; width: 100px; height: 200px; } Das Stylesheet für den IE ist "interessanter": body { margin: 0; overflow-y: hidden; /* IE-spezifisch, aber das ist ja ein IE-Stylesheet ;-) [1] */ } #menue { z-index: 1; position: absolute; left: 0px; top: 0px; width: 100px; height: 200px; } #hintergrund { z-index: 0; width: 100%; height: 100%; overflow: auto; /* das äußere <div> wird also dank overflow:auto scrollbar gemacht, <body> selbst bekommt keine Scrollbar ab. [1] */ } #inhalt { position: static; width: 400px; margin: 0px 20px 20px 135px; padding: 10px; } Angeblich soll es damit laufen, getestet habe ich es wie gesagt noch nicht. Für IE < 5 kommt man übrigens um ein Javascript, das das Menü immer an die passende Stelle schiebt, nicht herum. Allerdings flackert das dann immer etwas unruhig, da gefällt mir wegscrollen besser ;-) Die Verschachtelung #hintergrund / #inhalt ist nötig, da nur so die 100%-Größenangaben im IE passen. Die Angabe von right:0 und bottom:0 statt der Größenangabe in #inhalt würde dazu führen, dass das <div> auf die Inhaltsgröße ausgedehnt wird :-( [2] Außerdem scheint der IE die 100% immer auf die Größe von <body> zu beziehen, auch bei verschachtelten Elementen :-( Da das Ganze aber etwas OT wird, schlage ich vor, weitere Fragen dazu per PM zu klären.

...

...

Pixelgenaues Layout und HTML passen aber nicht zusammen, weil du weder Ausgabegeraet noch Ausgabebedingungen kennst. [...]

Ich weiß das. Allerdings wollen es viele Kunden nicht glauben (vor allem, wenn der Grafiker gerade vorher den Entwurf gezeigt hat - "bei dem geht es doch auch pixelgenau" ;-) BTW: mit den nötigen Tricks geht auch pixelgenaues HTML [3], allerdings bevorzuge ich flexible Layouts. Gruß Christian Boltz [1] IE 5 für Mac hat anscheinend Probleme mit scrollbaren <div>, ich würde das "overflow-y:hidden" für body evtl. weglassen. [2] Mozilla u. a. dehnen das <div> bei right:0 und bottom:0 auf die _Fenster_größe aus und setzen, overflow:auto vorausgesetzt, Scrollbars dazu. [3] Trotz "pixelgenau" kann das trotzdem noch den nötigen Spielraum haben, falls z. B. die Schrift größer gestellt wird. Ein üblicher Test bei mir ist z. B. 200% Schriftgröße in Mozilla ;-) -- Das soll jetzt wirklich keine Arroganz sein, aber es macht keinen Sinn, das Haus abzureissen, weil du den Hausschlüssel vergessen hast. :-) [Ratti in suse-linux]

Am Dienstag, 4. Mai 2004 11:28 schrieb Karl Sinn:

Hallo,

Am Montag, 3. Mai 2004 23:55 schrieb Christian Boltz:

...

Da das Ganze aber etwas OT wird, schlage ich vor, weitere Fragen dazu per PM zu klären.

Bitte nicht!!

Ich sage zwar nichts mehr, aber ich lese fleissig mit, und lerne...

Bleibt hier im Thread!

ACK MfG TB ( s Köchle) -- http://www.gasthof-linde.de htpp://www.chef-de-cuisine.de

Hallo, On 03-May-2004 Mathias Uebel wrote:

Ja, das haben wir hier schon oft besprochen: Viele Browser halten sich nicht an Standards. Es gibt verschiedene Mittel den benutzten Browser zu erkennen (mod_rewrite oder HTTP_USER_AGENT)

Ist aber in der Regel eher ueberfluessig oder gar stoerend. Zum Beispiel koennen sich Browser wie Opera auch als Mozilla oder Internet Explorer ausgeben. Das einzige, was sinnvoll sein kann, sind konditional comments, weil die propritaer sind und wirklich nur vom IE verstanden werden. Und da gerade der IE viele Standards nicht einhaelt und zahllose Bugs aufweist, kann man damit schon eine ganze Menge abfangen.

Ansonsten sind meine Erfahrung so: Um allen Browsern gerecht zu werden, muss man relativ einfachen Code verwenden und auf SchnickSchnack verzichten. Leider sehen die Seiten dann auch so aus!

Umgekehrt. Damit moeglichst Browser die Seiten vernuenftig darstellen koennen, muss man den Code ziemlich aufblaehen. Ansonsten, was ist Schnickschnack? Meinst du damit alles, was moeglichst viele Barrieren aufbaut? Dann kann ich nur sagen, dass mir diese Seiten in meinem Geschaeftsumfeld absolut die liebsten sind. Die Konkurrenz (z.B. ich :-) sitzt nur einen Mausklick entfernt. Beste Gruesse, Heinz. -- http://www.pahlke-online.de/reisenews/ http://www.Pahlke-KunstWebDesign.de/