How to make the Header Responsive

HTML-CSS
1

I’m not quite sure how to make the header responsive on mobile screens: https://codepen.io/rrichetto/pen/EevWXz

2

I would recommend using flexbox,

Before that, you have to remove the margin and float you have set to all the div’s inside the .container div, and also remove the margin-top that you have set to h1 element.
And apply the flexbox properties to the .container class

3

height: auto; on header would do the trick …