How to float/position Youtube video to the right of <p> text?

Question

We have not learned javascript as this is a beginner class but I need to somehow float or position my youtube video to the right. I have the float id in my CSS file as float: right;

<div id="content">
        <h1>Welcome!</h1>
        <p>"Do You Even Lift?" is an organization that will help you and many others get motivated to get in shape. If you want to get stronger,
         lose weight, gain weight or simply live a healthier life, you've come to the right place.<p>
         <p>For those that already lift, have lifted previously in their lifetime, are not sure if they lift or not, this video will be helpful in answering that question.</p>
        </div>
        <div id="float">
        <iframe src="http://www.youtube.com/embed/OloLS5kTrVs" width="400" height="315" frameborder="0" allowfullscreen>
        </iframe>
        </div>










<hr>
<div id="footer">Copyright &copy; 2014 Corey Osmon
    </div>


    </body>
</html>

Solution

Demo

HTML

<iframe src="http://www.youtube.com/embed/OloLS5kTrVs" width="400" height="315" frameborder="0" allowfullscreen></iframe>

 <h1>Welcome!</h1>

<p>"Do You Even Lift?" is an organization that will help you and many others get motivated to get in shape. If you want to get stronger, lose weight, gain weight or simply live a healthier life, you've come to the right place.</p>
<p>For those that already lift, have lifted previously in their lifetime, are not sure if they lift or not, this video will be helpful in answering that question.</p>
<div class="clear"></div>
<hr>
<div id="footer">Copyright &copy; 2014 Corey Osmon</div>

css

iframe {    
    width:50%;    
    float:right;    
}

.clear {    
    clear:both;    
}

Comments

[edwardsmarkf]

old post for sure, but i am running into this now. the problem is the "clickable area" does not want to align with the play button.