<p><em>When an :after rule has multiple pieces of content, older versions of Safari display them backwards.</em></p>

<style type="text/css">
    div.a {
       border: 1px solid black;
       padding: 10px;
       margin: 10px;
    }
    div.a:after {
        content:
            ' This should be before the green box. '
            url(resources/greenbox.png)
            ' This should be after the green box. '
        ;
        width: 200px;
    }
    div.b:after {
        display: block;
    }
    div.c:after {
        display: inline-block;
    }
</style>

<div class="a">Inline: </div>
<div class="a c">Inline-block: </div>
<div class="a b">Block:</div>