How to fix blocks on the same line?

Question

css

The thing is, I don't know how to make the title and navigation block not move after the screen size is reduced, although I use inline-block
Here is the block itself:
CodePen.io
Thanks in advance!

Answer 1

set the width for their parent
.header {
padding: 11px 26px 11px 26px;
position: relative;
width: 800px
}