CSS: have a div after an absolute positioned div

Answer 1

Because absolutely positioned elements do not "fill" the box of the playArea div, the height and width you assign each child div do not expand playArea's height and width. I'm not sure what the final problem is that you're trying to solve, but from the names of your ids you're trying to position elements within a "canvas" area. This is good.

The heights and widths of the absolutely positioned divs, again, have no impact on the playArea div's dimensions, but by knowing the heights and widths you are able to tell playArea what its dimensions should be. In this case, giving playArea a width of 580px and height of 785px will position the p element correctly.

Going off of your div ids again, it's a good idea to explicitly define the dimensions of anything like a playArea where the contained elements aren't laid out like normal page elements (absolutely positioned or not). That way, you'll have a more predictable layout.