Okay crew, I can't figure out the best way to do this.
Here is my site:
I want div1 to stay on the left hand side. That is working well.
I want div2 to be centered. (So I have #div2 {margin:0 auto;} 0 meaning all the way at the top, auto meaning it centers it from left to right.)
What goes wrong is when I resize my window(Or view it at a lower resolution), div2 goes behind div1.
How can I fix this so div2 stays centered, but never collides with div1(Meaning left margin is greater than 165(Width of div1))?
What it should be is auto>165. I don't want to set it at 165 because then it looks lopsided for everyone who has larger or widescreens
<body>
<div id="div1">
</div>
<div id="div2">
</div>
</body>
I have tried putting div1 inside div2, but it still does that.