08. Juli 2022

Divi Breakpoints – Desktop, Tablet, Mobil

Wenn man eine eigenen Abschnitt zum Beispiel mit display: flex designt, ist es wichtig zu wissen bei welcher px Anzahl die Divi Breakpoints sind.

Was sind die Divi Breakpoints?

Die Divi Breakpoints (deutsch: Umbruchstellen) sind die Pixelbreiten, bei der das Layout von Desktop auf Tablet oder von Tablet auf Mobil umschaltet.

Beim Desktop hast du zum Beispiel 3 Spalten und bei der Tabletansicht nur 1 Spalte, dafür 3 Reihen. Die Pixelbreite bei der dies umgeschalten wird, ist der Breakpoint.

Für die CSS Geeks heißt es CSS Media Query Breakpoints.

Divi hat eigene CSS Breakpoints.

Die 3 Divi Breakpoints sind:

The 3 Divi breakpoints are:

  • Desktop: Bildschirmbreite von 981 px und darüber
  • Tablet zwischen 980 und 768 px
  • Mobil: 767 px und darunter

Was sind die Divi CSS Media Query Breakpoints?

Die Divi Media CSS Media Query Breakpoints sind das gleiche, wie die Divi Breakpoints.

Nur kannst du mit dem CSS dein eigenes Styling hinzufügen.

/* Desktop */
@media all and (min-width: 981px) {
  /* Dein CSS */
}
/* Tablet */
@media all and (min-width: 768px) and (max-width: 980px) {
  /* Dein CSS */
}
/* Mobil */
@media all and (max-width: 767px) {
  /* Dein CSS */
}

Wie passt man die Divi Einstellungen an?

Wenn du die Divi Einstellungen für Mobil oder Tablet anpassen möchtest, kannst du das für jede Eigenschaft tun, indem du auf das Handy Icon klickst.

divi breakpoints

Hinweis: Einige Links auf dieser Seite könnten sogenannte Affiliate-Links sein. Wenn du auf so einen Affiliate-Link klickst und über diesen Link einkaufst, bekomme ich von dem betreffenden Online-Shop oder Anbieter eine Provision. Für dich verändert sich der Preis nicht.

0 0 votes
Article Rating
Abonnieren
Benachrichtige mich bei
guest
0 Comments
Inline Feedbacks
View all comments

Pin It on Pinterest