Why dont both div come side by side

How do get the 2 divs side by side.? You can view the page here http://wholesaletoriches.com/newsite/thankyou/new3/3/

I know the display block in a href causes the div to the next line but changing it to inline doesnt show the video

#video{
    width: 412px;
    //float: left;
    display: inline;
    margin: 35px 0 0 56px;
}        

<div id="video" 
     style="border: 1px solid rgb(204, 204, 204); width: 490px; height: 385px;"&g开发者_开发百科t;
    <a href="#" style="display:block;width:470px;height:365px;padding:10px;"
       id="player"> </a>
    <script type="text/javascript">
        flowplayer("player", "flowplayer-3.2.2.swf",{
            plugins: { controls: null },                        
            canvas: { backgroundColor: '#ffffff',backgroundGradient: "none"},
            clip: { url: 'a.mp4' },
            onLoad: function() {
                this.setVolume(100);
            }
        });
    </script> 
</div>
<div style="float:right;width:300px;height:385px;border:1px solid red;">

</div>

Uncommenting the float:left in #video should do the trick.

If you want the floated box to be beside the video (which I guess is what you're asking), you should switch them in the markup, so that the float comes first.