The final result can refer to the header banner of this page. ⬆️

the Originals

the Header

Components

Brand

Post title

Navigations

Responsive layout

Using the grid system from Bootstrap, the header can adapt to different window/screen size by arranging its components .

• xs and sm

Using media queries @media to manually add some style based on the width of the viewport.

display: flex