wie Überlappungen von eckigen Gitterelementen beim Schrumpfen behoben werden

8

Ich benutze angularjs 1.5.8 und versuche ein angular gridster layout wie dieses zu erreichen

und im mobilen Modus stapeln sich die Elemente untereinander. Meine gitter-Optionen sind wie folgt

%Vor%

und ich habe auch den folgenden Stil verwendet

%Vor%

Das Gitter sieht auf dem Desktop-Bildschirm gut aus, wenn es in der Größe oder im Vollbild verkleinert wird. Das Gitter überlagert sich und die Elemente unter einander beginnen sich zu überlappen.

Wie gehe ich damit fort? Ist mein Layout falsch, danke im Voraus.

Hinweis:   Es wäre besser, wenn ein Beispiel mit Bootstrap-CSS-Klassen gegeben wäre

    
user93 04.09.2016, 03:11
quelle

1 Antwort

2

ist es schließlich gelungen, das Problem zu replizieren, indem du ng-class="{smalltiles:item.sizeY<2,largetile:item.sizeY>1}" zum gitterelement hinzufügst, siehe Ссылка und versuche, 2 (KLEINE FLIESE) über 3 (GROSSE FLIESE) . Diese Geige verwendet min-height CSS-Regel.

hier Ссылка alle min-height CSS-Regeln werden durch height CSS-Regel ersetzt und hier 2 verschoben (SMALL TILE) über 3 (LARGE TILE) erzeugt keine Überlappung.

BTW: Der Index in dieser Geige wird mit attr() CSS-Funktion gedruckt, die diesen Wert aus der tabindex HTML-Eigenschaft innerhalb der content CSS-Regel abruft:

%Vor%     
Andriy 16.09.2016, 07:09
quelle

Tags und Links