CSS: float:left with a margin-right doesn't push all elements away
        Posted  
        
            by Paul Tarjan
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by Paul Tarjan
        
        
        
        Published on 2010-03-28T17:53:36Z
        Indexed on 
            2010/03/28
            18:13 UTC
        
        
        Read the original article
        Hit count: 427
        
I'd like all my content to flow around an image. To do this, I simply did
img#me {
    width: 300px;
    float: left;
    margin-right: 30px;
}
This works for text wraping, but other elements go behind it. For example
<style>
h2 {
   background: black;
   color: white;
}
</style>
<img id="me" src="http://paultarjan.com/paul.jpg" />
<h2>Things!</h2>
Then the h2 background flows right past the 30px margin. How should I do this instead?
Live example: http://paulisageek.com/tmp/css-float.html
© Stack Overflow or respective owner