Why can't I position the Player?

I’m trying to put this media player between some containers of text, yet the Player seems to overlap the container no matter what I try.

Here is a simplified version of what code is on the page:

<div class="column2">

<div class="container1">
TEXT text TEXT 
</div>

<div id="player">
<script type="text/javascript">
Etc. etc. etc.
var so= new SWFObject("player.swf", "player", "620", "470", "9", "#000000");
var video_id= get_id();
</script></div>

</div>//column2//

And the CSS:


#player {
  border: 2px solid #800000;
  border-width: 1px 1px 1px 1px;
  width:600px;
  height:500px;
  margin:0px 0px 0px 0px; 
  padding: 0px 0px 0px 0px;
  background-color:#ffffff;
}

I’d like the Player below the conatiner of text, with a bit of a margin in between. When I try to move the player down, so it doesn’t partially overlap with the Container 1 text, (by adding 100px to the top margin of the Player, for example), it just moves the Player downward, but the border of #recorder stays overlaped. Any help will be appreciated.

That code is not really complete. Do you have a link? It’s a hundred times easier to help that way. :slight_smile:

Thanks for your reply. Sorry I can’t provide a link.
Any guesses?

Could you supply the styles for container1? That will help explain how the video div is interacting with it.

thanks. Here is the css:

				.container1 {
				float: right;
				width: 690px;
				height: 250px;
				font-size:1em;
				margin: 5px 0px 0px 10px;
				padding: 0px 0px 0px 10px;
				overflow: visible;
		}

What does #recorder relate to?

Thanks for your reply, I meant #player not #recorder

Because the container1 above is floated, top margins on the #player will slip underneath the container1. So my first question would be—Does the container1 need to be floated? If it does, there are few ways around this. The easiest is probably to give clear: both to the player, and set a bottom margin on container1.