Wenn ich mir viele CSS-Rastersysteme und Frameworks anschaue, haben sie normalerweise eine standardmäßige Spalten- und Zeileneinrichtung mit prozentualen Breiten. So etwas zum Beispiel:

Standardrasterspalte:

.col-10 {
  width: 83.33333%;
  width: calc(100% / 12 * 10);
  width: -webkit-calc(100% / 12 * 10);
  width: -moz-calc(100% / 12 * 10); }

Darüber hinaus sehe ich jedoch oft andere Klassen wie.push oder.pull. Zum Beispiel so:

Push / Pull Klassen:

.push-10 {
  left: 83.33333%;
  left: calc(100% / 12 * 10);
  left: -webkit-calc(100% / 12 * 10);
  left: -moz-calc(100% / 12 * 10); }

.pull-10 {
  left: -83.33333%;
  left: calc(-100% / 12 * 10);
  left: -webkit-calc(-100% / 12 * 10);
  left: -moz-calc(-100% / 12 * 10); }

Ich bin schon ein bisschen mit Rastersystemen umgegangen, aber ich habe diese Klassen nie gebraucht. Wahrscheinlich, weil ich nicht weiß, was sie tun. Meine Fragen sind also:

Was macht eine Push-Klasse normalerweise?Was macht ein Pull-Kurs normalerweise?Wann möchten Sie jeden von ihnen verwenden?Wie benutzt du jeden von ihnen?Stellen Sie ein Geigenbeispiel zur Demonstration bereit.