Display Currency with Prices via CSS Generated Content ::before and ::after

HTML

<h1>£</h1>

<ul>
    <li class="price">3.50</li>
    <li class="price">4.75</li>
</ul>

CSS

ul{position:relative}
.price{text-align:center; outline:1px solid #000; width:200px; height:60px}
.price:before,.price::before{content:'£'; position:absolute; z-index:12; font-size:50px; left:0; top:0; width:200px; height:60px}
.price:after,.price::after{}