unterschiedliche darstellung css navi (ff und ie) Einstellungen

[claudettina]

Das war mir fast klar, dass hier eine Tab vs Div-Diskussion kommt *lolol* Um ehrlich zu sein, habe ich auch schon daran gedacht, mit Containern zu arbeiten, vielleicht mache ich mir mal die Arbeit und setz mich ran. Ich mag ja die Seite ccs4you - und eine andere Seite von mir habe ich schon mit Containern gestaltet.

Thomas, ich hatte vergessen, auf Deinen Einwand mit den Scrollbalken zu reagieren - sorry. Es stimmt, dass man nicht sieht, wo man ist, ich wollte den Scrollbalken einfach so unsichtbar wie möglich machen. Dein Einwand macht mich aber nachdenklich, ich denke ich werde mal einen Rahmen einrichten. Und noch was - meinst Du, es ist besser, die Masse an Thumbnails auf verschiedene Seiten zu verteilen? Es sind sehr viele, das stimmt, aber es wird ja eine reine Fotoseite, und meine Freundinnen wissen ja, was sie erwartet .

Claudia

[Thomas]

Thomas, ich hatte vergessen, auf Deinen Einwand mit den Scrollbalken zu reagieren - sorry. Es stimmt, dass man nicht sieht, wo man ist, ich wollte den Scrollbalken einfach so unsichtbar wie möglich machen. Dein Einwand macht mich aber nachdenklich, ich denke ich werde mal einen Rahmen einrichten.

Dann hättest du aber auch die Pfeilchen noch einfärben müssen, dann wäre er gar nicht mehr zu sehen - mich stört eigentlich am meisten, dass man das Teil nicht sieht, zum Scrollen benutze ich es eigentlich eher selten, aber es ist immer ein guter Indikator wie viel Inhalt sich auf der Seite befindet bzw. wie weit man scrollen kann. Und außerhalb des IE funktioniert das Einfärben eh nicht ...

Und noch was - meinst Du, es ist besser, die Masse an Thumbnails auf verschiedene Seiten zu verteilen? Es sind sehr viele, das stimmt, aber es wird ja eine reine Fotoseite, und meine Freundinnen wissen ja, was sie erwartet .

Sofern du die Seiten alle von Hand strickst, ist der administrative Aufwand ist mit mehreren Seiten natürlich größer. Falls du ein entsprechendes Tool hast, sollte der administrative Aufwand allerdings nicht viel größer sein. Aber ich habe schon öfter festgestellt, dass manche Systeme bei Seiten mit wirklich vielen Grafiken Probleme bekommen und ggf. spürbar langsamer reagieren - und die Download-Zeiten sind natürlich auch viel höher. Ich würde die Thumbnails auf mehrere Seiten verteilen. Es gab da mal eine Regel mit maximal 50 kB pro Seite - keine Ahnung, ob die in DSL-Zeiten immer noch gilt ...

[Conny]

Hallo,

Hast du eine Ahnung, warum der IE den oberen Rand der A-Tags abschneidet?

Ich glaub nicht so sehr, daß es abgeschnitten wird, der IE läßt an der Stelle einfach weniger Platz und hierdurch kommt es dann zu dieser überschneidung.
Vermutlich (so aus'm Bauch heraus) liegt das an der Unterschiedliche Bewertung (der Beiden Browser IE und FF) von Margin und Padding; auch die height=100% Angabe im Table-Tag könnte problematisch sein (nicht getestet) Wenn eine height Angabe im Table-Tag, dann über Style="height: 100%"
Ist aber hier wohl nicht entscheident.

cu
Conny

[claudettina]

Huppsala! Jetzt habe ich eine Seite mal spaßeshalber mit Div-Containern gemacht - aber wieso zeigt nur der IE die Seite zentriert an, aber nicht FF, NS und O? Trotz text-align:center... Habe ich irgendwo einen Denkfehler oder gibt's noch einen weiteren Befehl?

http://www.claudiafinke.de/indextest%5B3%5D.html

Nochmal danke für die nette und schnelle Hilfe hier.
Claudia

[Conny]

Hi Claudia,
abhilfe für FF, direkt nach dem body-Tag den center-tag einfügen (und ganz am Schluß vor /body natürlich schließen!).
Dann hast Du einmal ein /div zuviel, einmal vor /body rausnehmen.

Weniger wichtig:
Einmal Title aus dem Head herausnehmen, ist zwei mal vorhanden und Doctype deklarieren, dann läßt es sich leichter validieren!.

Schon übersichtlicher geworden!

cu
Conny

[Thomas]

Naja, CENTER ist ja deprecated. Ein allgemeines Verständnisproblem ist glaube ich, dass man meint, text-align gälte auch für Block-Elemente. Korrekt ist nach meinem Wissen, dass es eigentlich nur für Inline-Elemente gilt (außer natürlich beim IE). D. h. schreibst du innerhalb von dem BODY mit "text-align: center;" normalen Text, ist dieser auch zentriert, das DIV (als Block-Element) dagegen nicht. Block-Elemente zentriert man (vertikal) über "margin-left: auto; margin-right: auto;". Bin leider nur kurz online, deshalb ist das jetzt ein bißchen aus der Hüfte geschossen, aber so grob müsste das funktionieren.

[Conny]

Hallo,

... CENTER ist ja deprecated...

ist natürlich richtig, aber es ist am einfachsten und funktioniert einwandfrei!

Imho haben die da vorschnell etwas für deprecated erklärt, ohne einen vernünftigen ersatz zu schaffen (außer natürlich über diese etwas umständliche Margin Geschichte)

Persönlich handhabe ich es genau so, solange es 'nur' deprecated ist, ist es (noch) kein Fehler und erlaub (mit verlaub )

cu
Conny

[Thomas]

Imho haben die da vorschnell etwas für deprecated erklärt, ohne einen vernünftigen ersatz zu schaffen (außer natürlich über diese etwas umständliche Margin Geschichte)

Das ganze Zentrieren (viel schlimmer noch vertikal) ist ja nicht ganz einfach. Besser wäre es wohl gewesen, statt text-align eine Art "inner-align" zu schaffen, das dann auch für Block-Elemente gilt. Man könnte zwar auch argumentieren, dass jedes Block-Element seine Position selbst bestimmen sollte, aber der Innnenabstand des Elternelements beeinflusst ja auch die Position - lassen wir uns mal überraschen, was da noch so kommt.

Persönlich handhabe ich es genau so, solange es 'nur' deprecated ist, ist es (noch) kein Fehler und erlaub (mit verlaub )

Ich versuche eher, die mißbilligten Tags zu vermeiden, aber das kann man wahrscheinlich genauso wie den TABLE-DIV-Streit ewig diskutieren .

Ich verabschiede mich für eine Woche in den Urlaub, also nicht wundern, wenn ich nach einem fulminanten Neustart erstmal wieder still bin ...

[Auge]

Hallo

Standardkonform ist das zentrierte Anzeigen eines Blockelements mit margin-left:auto; margin-right:auto; zu erreichen.

Aber wer kann's mal wieder nicht? Richtig, der MSIE (zumindest bis V 6). Der benutzt text-align:center; um dies zu erreichen. Diese Angabe ist allerdings nicht für Blockelemente, sondern für deren Inhalte gedacht.

Zu umgehen ist das Dilemma durch folgendes Vorgehen:

QUELLTEXT

<html>
<head>
  <title>Zentriertest</title>
</head>
<body>
  <div id="all">
   <h1>Zentriertest</h1>
   <p>Irgendwelcher Fülltext ohne tieferen Sinn.</p>
  </div>
</body>
  </html>

Soweit der HTML-Quelltext.

QUELLTEXT

body {
  margin:0;
  padding:0;
  text-align:center;
  }

Die Angabe zum text-align lässt den Inhalt von <body> zentriert erscheinen. Der MSIE wendet dies auch auf Blockelemente (hier <div id="all">, <h1>, <p>) an, alle anderen Browser zentrieren nur den Text innerhalb der Blockelemente. Dies wird deutlich, wenn wir im nächsten Schritt dem <div> eine Breite verpassen.

QUELLTEXT

#all {
  width:20em;
  border:1px solid;
  }

MSIE zentriert den Block auf der Seite (so wie es claudettina bei sich beobachtet hat) mit zentriertem Text, alle anderen Browser zeigen den Block auf der linken Seite mit zentriertem Text. Wir zentrieren den Block nun standardkonform. Der MSIE wird es ignorieren, aber der hat ja schon eine ihm verständliche Angabe.

QUELLTEXT

#all {
  margin:1em auto;
width:20em;
border:1px solid;
}

Der Block ist nun überall zentriert. Zusätzlich schaffen wir 1em Platz nach oben. Allerdings ist immernoch der Text zentriert. Ist das nicht gewünscht, geben wir für <div id="all"> noch text-align:left; an. Die Angabe gilt für alle Elemente (für den MSIE) und deren Inhalte innerhalb von <div id="all">.

Damit sollte allen Browsern gedient sein.

Tschö, Auge

[Google Bot]