Les points de rupture sont les dimensions auxquelles le contenu de votre site va s'adapter pour fournir aux internautes la meilleure mise en page possible pour consulter l'information. Un point de rupture divise la hauteur ou la largeur de la fenêtre (viewport) (écrans, imprimantes et autres types de média de sortie) en "tranches". Par exemple, un point de rupture  avec une largeur de 40em définit deux "tranches" : une pour les largeurs jusqu'à 40em, une autre pour les largeurs supérieures à 40em. Les points de rupture peuvent servir à déterminer quand la mise en page doit changer, quand les images doivent être redimensionnées et tout autre adaptation nécessaire aux changements de dimensions de la fenêtre (viewport).