oder HTML: direction für Ansicht-Reihenfolge

[Beat]

hi
Ich habe folgendes Markup

<div id="main"><!--  
--><div id="content">  
...Content hier ...  
  </div><!--  
--><div id="sidebar">  
...Nebensächliches hier ...  
  </div><!--  
--></div>  

Die HTML Logik ist also Content vor Aside.

CSS verwendet nun:

#content,  
#sidebar { display:inline-block; }  

Dadurch wird der Sidebar rechts in der Anzeige erscheinen.

Ich möchte aber die Anzeigereihenfolge umstellen.
Ich habe zwei Möglichkeiten und beide funktionieren soweit.

a) verwende HTML dir Attribute
dir="rtl" in main
dir="ltr" in content und sidebar

b) via CSS Eigenschaften:

#main    { direction:rtl; }  
  
#content,  
#sidebar {   direction:ltr; }  

Vom Standpunkt der Flexibilität ist mir die CSS Lösung lieber.
(beliebige CSS-Themes können das gleiche HTML-Layout verwenden.)

Meine Frage: Gibt es Einwände gegen die CSS Methode, etwas das ich nicht bedacht habe?

mfg Beat

[Der Martin]

Hallo,

Die HTML Logik ist also Content vor Aside.

das klingt für mich vernünftig, auch wenn ich üblicherweise die Reihenfolge andersrum wählen würde. In einem Print-Medium kommt schließlich auch das Inhaltsverzeichnis vor dem Inhalt (dabei gehe ich davon aus, dass deine Sidebar die Navigation enthält).

b) via CSS Eigenschaften:

#main    { direction:rtl; }

#content,
#sidebar {   direction:ltr; }

  

> Vom Standpunkt der Flexibilität ist mir die CSS Lösung lieber.  
  
Mir auch.  
  

> Meine Frage: Gibt es Einwände gegen die CSS Methode, etwas das ich nicht bedacht habe?  
  
Möglich. Ich finde deine Argumentation aber absolut schlüssig: Es geht um Darstellung - was wird links, was rechts angezeigt. Darstellung ist aber Sache von CSS. Daher finde ich die Lösung völlig okay.  
  
Ciao,  
 Martin  

-- 
Der Stress von heute ist die gute alte Zeit von morgen.  

[cygnus]

Hallo Martin,

Die HTML Logik ist also Content vor Aside.

das klingt für mich vernünftig, auch wenn ich üblicherweise die Reihenfolge andersrum wählen würde. In einem Print-Medium kommt schließlich auch das Inhaltsverzeichnis vor dem Inhalt (dabei gehe ich davon aus, dass deine Sidebar die Navigation enthält).

--><div id="sidebar">
...Nebensächliches hier ...
  </div><!--
--></div>

Die Navigation kann das nicht sein.

mfg
cygnus

[Gunther]

Hi Beat!

Dadurch wird der Sidebar rechts in der Anzeige erscheinen.

Ich möchte aber die Anzeigereihenfolge umstellen.
Ich habe zwei Möglichkeiten und beide funktionieren soweit.

Meine Frage: Gibt es Einwände gegen die CSS Methode, etwas das ich nicht bedacht habe?

Warum verwendest du nicht "einfach" float?
Solange es "nur" um 2 Container geht, die egal wie rum nebeneinander angeordnet werden sollen, scheint mir das doch immer noch die "beste" (, sicherste und einfachste) Variante zu sein.

Gruß Gunther

[Beat]

Warum verwendest du nicht "einfach" float?
Solange es "nur" um 2 Container geht, die egal wie rum nebeneinander angeordnet werden sollen, scheint mir das doch immer noch die "beste" (, sicherste und einfachste) Variante zu sein.

Ganz im Gegenteil. Ich handle mir mit inline-block schon mal keine clearing bugs ein.

mfg Beat

[Gunther]

Ganz im Gegenteil. Ich handle mir mit inline-block schon mal keine clearing bugs ein.

Von welchen Bugs in welchen Browsern sprichst du?

Dafür handelst du dir mit direction u.U. andere "exotischere" Bugs ein. Floats sind so ziemlich die am häufigsten verwendete Eigenschaft und sollten somit auch im Hinblick auf unerwünschte Nebenwirkungen bestens erforscht sein.

Ich habe vor langer Zeit auch mal mit der Variante der direction im Zusammenhang mit den display:table-xxx Eigenschaften experimentiert. Da macht diese Variante imho noch Sinn, weil es dabei ja um die grundlegende Vermeidung von Floats geht. Wo dies aber nicht zwingend erforderlich ist, würde ich Floats den Vorzug geben.

Du musst ja auch evt. Wechselwirkungen mit anderen Eigenschaften berücksichtigen, wie bspw. :lang(), clip, overflow, text-align und unicode-bidi.

Und ggf. schaffst du dir Probleme bei Tabellen und multilingualen Websites.

Gruß Gunther

[Beat]

Dafür handelst du dir mit direction u.U. andere "exotischere" Bugs ein. Floats sind so ziemlich die am häufigsten verwendete Eigenschaft und sollten somit auch im Hinblick auf unerwünschte Nebenwirkungen bestens erforscht sein.

Erforscht und für den Entwickler fixbar bedeutet leider nicht, dass meine CMS-Anwender solche Fixes auch anwenden können.

Ich habe vor langer Zeit auch mal mit der Variante der direction im Zusammenhang mit den display:table-xxx Eigenschaften experimentiert. Da macht diese Variante imho noch Sinn, weil es dabei ja um die grundlegende Vermeidung von Floats geht. Wo dies aber nicht zwingend erforderlich ist, würde ich Floats den Vorzug geben.

Hast du Probleme festgestellt?

Du musst ja auch evt. Wechselwirkungen mit anderen Eigenschaften berücksichtigen, wie bspw. :lang(), clip, overflow, text-align und unicode-bidi.

Ich weiss um den Vorteil von dir und direction in einem gemischten Kontext.
Natürlich willst du, dass dir im Einklang mit dem Haupt-Sprache des Contents ist. Sollte es Probleme geben, helfen dir und direction.

Und ggf. schaffst du dir Probleme bei Tabellen und multilingualen Websites.

Welche?

Floats nehmen dir nicht die Aufgabe ab, bei Sprachen mit abweichender Schreibrichtung entweder dir oder direction zu verwenden, falls der automatische bidi Algorithmus mal nicht ausreicht.

Aber ich gebe dir Recht, bei
-Content
-Aside Left
-Aside Right
kannst du bei floats den Content bei geeignetem Markup in der Mitte darstellen. Aber ich vermute Stark, im Falle eines dreispaltigen Layouts würde ich JS für ein dynamisch berechnetes Layout einsetzen, mit absolut positionierten Asides.

mfg Beat

[Gunther]

Hi Beat!

Ich habe vor langer Zeit auch mal mit der Variante der direction im Zusammenhang mit den display:table-xxx Eigenschaften experimentiert. Da macht diese Variante imho noch Sinn, weil es dabei ja um die grundlegende Vermeidung von Floats geht. Wo dies aber nicht zwingend erforderlich ist, würde ich Floats den Vorzug geben.

Hast du Probleme festgestellt?

Nein. Und da es schon eine ganze Weile her ist, habe ich damals noch mit allen gängigen (Win) Browsern in entsprechend älteren Versionen getestet.
Und da sich AFAIK an der Unterstützung von direction nichts Nachteiliges verändert hat, dürfte es auch heute keine Probleme damit geben.

Gruß Gunther