Container Classes

Responsive breakpoint

A breakpoint, in responsive web design, is the point at which a website’s content and structure will adjust to deliver a better user experience. Breakpoints are pixel values that a developer/designer may declare in CSS. When a responsive website hits those specific pixel values, a transformation (such as the one described above) ensures that the website provides the best possible user experience.

A breakpoint is defined by the CSS @media declaration. This is also known as a media query. For example, let’s say we have a media query that looks like this.