[Jakku]

So, hi.

I just began to design a new website. And once again I am facing this frustrating problem which I am unable to solve. Thousands of times searching and still no proper results. So the question is, how do I prevent these DIV- elements from colliding with each other when zooming the page? This is how my site is supposed to look, no matter if zoomed or not:


http://i.imgur.com/MBXtl.png - Original image

But, when I zoom it the following happens:


http://i.imgur.com/qcNKQ.png - Original image

As you see, the "blabla"- element collides with the other element. I want to prevent this from happening. Please, help me if you have any knowledge! Thanks in advance.

Oh, and here's the CSS code for that colliding "blabla"- element. Let me know if you need something else.

Код:

#news
{
  width:220px;
  height:500px;
  border: 3px solid white;
  margin-top:-710px;
  margin-left:150px;
}

EDIT: I just noticed http://sa-mp.com/ behaves this way aswell. The navigation is colliding with the centered content. This is annoying especially when you have a very large or either very small resolution.