Zeilen mit gleicher Höhe für Elemente mit fließender Breite

Ich habe Chris Coyiers benutztBlöcke gleicher Höhe in Zeilen Das jQuery-Skript wurde schon oft geschrieben und hat immer hervorragend funktioniert.

Davon abgesehen habe ich immer Websites entwickelt, die für eine bestimmte Auflösung erstellt wurden. Dieses Mal entwickle ich eine responsive Website und der Hauptcontainer hat eine flüssige Breite. Als solches bin ich auf ein Problem gestoßen und kann keine Lösung für mein Problem finden.

In seinem Beitrag sagt Chris Folgendes über die Flüssigkeitsbreite:

Was ist mit der Flüssigkeitsbreite? Einer der Hauptgründe dafür, dass keine Tabelle verwendet wird, ist, dass sich schwebende Divs basierend auf dem verfügbaren horizontalen Raum neu anordnen können, was für die Flüssigkeitsbreite von Vorteil ist. Wir können den obigen Code anpassen, um auch damit fertig zu werden. Grundsätzlich wird bei der ersten Ausführung die Höhe jedes Blocks gemessen und mit der data () -Methode von jQuery gespeichert. Führen Sie dann den Code erneut aus, wenn die Größe des Fensters geändert wird. Verwenden Sie jedoch die Originalgröße, um die Zeilen anzupassen, nicht die neue Größe.

Beachten Sie, dass er sich speziell auf einen Behälter mit Flüssigkeitsbreite bezieht. In meinem Fall haben nicht nur der Container, sondern auch die untergeordneten Elemente eine fließende Breite. Genau die Blöcke, die ich ausgleichen muss, sind die gleichen Blöcke, haben Flüssigkeitsbreiten und passen sich der Auflösung des Fensters / Containers an.

Ich glaube, dass das Skript nicht mehr richtig funktioniert, da sich die 'originalHeight' des Elements mit der Containergröße ändert.

Meine Spekulation mag falsch sein, aber auf die eine oder andere Weise funktioniert dies nicht mit Elementen mit fließender Breite. Hilfe gesucht!

Natürlich ist hier einjsfiddle Ich habe erstellt, um das Problem zu demonstrieren. Ändern Sie einfach die Breite des Fensters und Sie werden feststellen, dass die Höhen der Container nicht aktualisiert werden.

Ich führe den folgenden Code aus, um die Funktion für das Fenstergrößenänderungsereignis aufzurufen:

$(window).resize(function() {
    columnConform();
});

Danke im Voraus

Antworten auf die Frage(2)

Ihre Antwort auf die Frage