In need of help from a HTML + CSS geek

In need of help from a HTML + CSS geek - Printable Version

+- SA-MP Forums Archive (https://sampforum.blast.hk)
+-- Forum: Other (https://sampforum.blast.hk/forumdisplay.php?fid=7)
+--- Forum: Everything and Nothing (https://sampforum.blast.hk/forumdisplay.php?fid=23)
+--- Thread: In need of help from a HTML + CSS geek (/showthread.php?tid=392090)

In need of help from a HTML + CSS geek - Jakku - 12.11.2012

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.

Re: In need of help from a HTML + CSS geek - Zircon-Hosting - 12.11.2012

position:fixed;
Use that on your CSS.

Re: In need of help from a HTML + CSS geek - Jakku - 12.11.2012

I do not want the element to scroll with me throughout the page. So no, that's not a solution. Thanks anyways

Re: In need of help from a HTML + CSS geek - Michael@Belgium - 12.11.2012

It should be obv with position what if you try this:

Код HTML:

position: absolute;

Or you have also

Код HTML:

position: relative;

Re: In need of help from a HTML + CSS geek - Jakku - 12.11.2012

Either I am missing something or that is not the right solution for this.

Код:

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

Nope.