Preview:
<style>
body {
padding:20px;
}
h3:before {
content: ":before ";
}
h3:after {
content: " :after";
}
div {
width: 200px;
height: 150px;
position: relative;
background: yellow;
}
div:before {
content: ":before";
position: absolute;
right: -10px;
top: 20px;
height: 30px;
width: 60px;
background: lightblue;
}
div:after {
content: ":after";
position: absolute;
left: 20px;
bottom: 10px;
height: 30px;
width: 60px;
background: lightgreen;
}
</style>
html:
<h3>simple header</h3> <div>simple div</div>
css :before and :after support - supported by all modern browsers and ie8+.