This is what it looks like at the moment

and this is what I want it to look like

I can edit the width of the mediaplayer class to move it across, but then when I open it on a different size screen, or zoom out, it moves off the edge of the middle.
How can I attach it to the side of the middle part? The #mediaplayer is the media player and the #container is the black thing in the middle
#mediaplayer{float:right; width: 385px; margin: 0 auto;}
#container
{
width: 900px;margin: 0 auto;padding: 5px; border-top: 2px solid #cccccc;
border-right: 2px solid #cccccc;border-bottom: 2px solid #cccccc;
border-left: 2px solid #cccccc; background-color: #000;
}