Hoe te maken: Responsieve float

Leer hoe je met CSS responsieve float-elementen maakt.

Responsieve float

Gebruik media queries en stel een specifieke schermbreedte in (in pixels) om te bepalen wanneer een element moet floaten:

/* Op schermen met een breedte van 768 pixels of kleiner wordt geplaatst aan de rechterkant */
@media (max-width: 768px) {
  .float-right-sm {
    float: right;
  }
}
/* Op schermen met een breedte van 769 pixels of groter wordt geplaatst aan de rechterkant */
@media (min-width: 769px) {
  .float-right-lg {
    float: right;
  }
}

Probeer het zelf

Gerelateerde pagina's

Handleiding:CSS drijven