Menu wrapping adjustment

I just adjusted my screen to 800 x 600 (those were the days) and I have the 3-bar menu. It’s < 980px is the reason. So there’d need to be @media styling.

And coincidentally, 800 x 600 is the dimension of a small tablet these days.

To avoid all these mess shoudl I consider making the Menu wide and place it across the entire pagewidth and place the logo in the centre! But that will change the entire look of my website! that I am afraid of.

@ef made some suggestions above

Okay, Let me get it cleared what I have understood.

I need to put the custom codes all the @media styling {} which ever is mentioned for individual devices. right?

I mean the same styling code in each @media?

Same styling code (selectors), but with adjusted values for each different block.

Try using Resizer which helps test the different viewports.

this link doesnt open

Resizer

I think This is somewhat resolved now.