I wrote the divs in reverse order in the HTML so that the order of the divs would be right. In CSS I set all divs to inline-block display and then floated div1 left and floated div2 and div3 right.
I left the divs as block elements, floated div3 right, set div2s margin to auto and left div1 as it is.
I nested div2 inside of div1 so that it would 'be on top of' or 'lay-over', or however you say it correctly, div1. In CSS I set the margin on div1 to auto to center it horizontaly and then with the Dev Tools I did some maths to find out what I needed to set the margins on div2 to center it vertically. I put the words "div1" in a p tag and set the margin to 0 so that it wouldn't effect the position of div2.
I set the display for both divs to inline-block so they would be next to each other in a line. I then set div2 to a relative position and floated it left. I set div1 to an absolute position so that div2 would float on top of it. I then set the margin of div2 to half of the pixels of div1s length and width to offset it.
I floated the first div right, the second div I set its margin to auto so that it centers horizontally and did nothing to the third div. I put a clear fix for all divs; set clear to both so that the second div wouldn't be in the first divs line.