I have boxes of different widths and heights, they can be any element type, but are currently divs.
I need o align the elements so that they have the same space in between them.
IE: I want to take the bottom 2 red boxes on the left and float them up to the bottom of the blue box on top. Any Suggestions?
Try enclosing the blue andt two red boxes in a div of about 50% width that is floated to the left.
The right-hand red and blue boxes can also be enclosed in another containing divc left floated up against the previous left floated box.
The green and yellow boxes - where they go nobody knows 
It would help if you supplied a link to what you have already tried.
Your right, I guess I should have mentioned there is jquery behind the scenes, that is sortable, I have also tried draggable. The problem is not only are the boxes that display per page dynamic based on users choice, the sizes are also dynamic based on the users choice. And the positions have to be stored in a database so the boxes are the same the next time the user logs in.
>>> Login
Warning: Invalid argument supplied for foreach() in /home/content/ZZZ/XXXXXXXXX/html/Include/org.jameskenny.widgets/UI/display_user_widgets.php on line 4
I didnt make it to the default section yet, I updated mysql to give you the tables I had
nvm, went with draggable and storing those positions instead