Wie invertiere ich die Elementposition mit CSS?

Question

Etwas von einem alten Problem hier, ich habe über 20 verschiedene Artikel gelesen und wurden daran erinnert, wie schwer das ist. Wenn es eine Antwort gibt, bitte posten Sie oder weisen Sie mich darauf hin.

Hier ist eine Geige von dem, was ich versuche zu erreichen: http://jsfiddle.net/6xuSp/

Anforderungen: Element

• Vertikal zentriert Inhalt Boxen (left und right)
• Linke erklärte auf der rechten Seite angezeigt werden
• Keine Höhen deklariert (entweder content-Box könnte variable Inhalte haben, und ja, ich habe eine Höhe auf einer Inhalts-Box in der oben genannten Geige erklärt, nur um die Zentrierung anzuzeigen
)
• Kein Javascript
• Alle gängigen Browser unterstützt (IE8 +, 7 schön ist die Anzeige ideal, 6 ist kein Problem)

Die obige Geige so ziemlich das tut, was ich will, mit Ausnahme der Inversion der 2 Inhaltsfelder. Ich habe die Float-Attribute ungültig gemacht, da sie die vertikale Ausrichtung abbrechen. Es macht mir nichts aus, wenn wir Floats (oder eine andere CSS-Technik) verwenden, solange wir die obigen Anforderungen erfüllen können.

prost, d

Answer 1

Ist das, was Sie wollen?

Demo

Answer 2

Ich denke, diese Geige tut, was Sie wollen:

http://jsfiddle.net/6xuSp/37/

Statt die Reihenfolge der Invertierung, ich z-index verwendet habe das Recht Kasten oben zu setzen.