Wie kann ich die Anzahl der Karten in einer Bootstrap -Zeile mit Medienabfragen ändern? ⇐ CSS

[Guest]

Code: Select all

< /code>
Dieses Div enthält Karten, die auf der Webseite angezeigt werden. Wie es steht, wenn die Bildschirmgröße XL 4 -Karten angezeigt wird, ist groß 3, Medium 2 und klein. Um es kleiner zu machen, funktioniert alles, wie es sollte, aber wenn sie sich dem Ende der XL -Bildschirmgröße nähern, überlappen sich die Karten horizontal. Dies geschieht auch zwischen 3 Karten, die angezeigt werden und 2 Karten angezeigt werden. Zwecke. So sieht es aus: < /p>
  @media (min-width: 1200px) and (max-width: 1450px) {
background-color: red; // Test if this is applied
}

@media (min-width: 990px) and (max-width: 1050px) {
background-color: red;
}
< /code>
Meine Frage ist, was kann ich tun, um die Anzahl der angezeigten Karten anzupassen, damit im ersten @media -Tag 4 Karten angezeigt werden. >  und für das zweite @media -Tag, was kann ich tun, es wird 2 anstelle von 3 Karten angezeigt. = "snippet-code">