Question

I am designing a website but facing a major problem. The problem is that website looks fine on my current resolution. But as soon as I start zooming in or out (ctrl+ + , ctrl + -) on my browsers the content in header and footer starts moving around.

I want the navigation items and footer content to keep their positions even if the page is zoomed in or out.

Any help will be appreciated. The css is simple therefore it won’t be too much hassle to identify the issue.
Here is URL: http://verdiensamen.nl/TestingSoccer/

Answer 1

set the specific Width of the container. Like this

 #container {
  min-width: 800px;
  margin: 0 auto;
  margin-top: 1%;
  }

It will solve your problem.