попробовал используя на svg
и для удобства Raphael
тег svg в моей опере 11.61 при border-radius и overflow: hidden вроде стал нормально обрезать контент
по-моему можно использовать
анимация для наглядности
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>test</title>
<script src='http://yandex.st/raphael/1.5.2/raphael.min.js'></script>
<style>
body { background: url('http://visualliteracyksu2010.files.wordpress.com/2010/10/wpid-paper_texture.jpg') no-repeat; }
#notepad,
#notepad svg {
width: 150px; height: 150px;
background: green;
border-radius: 75px;
overflow: hidden;
}
</style>
<script>
window.onload = function () {
Raphael("notepad", 150, 150)
.circle(250, 250, 200)
.attr({
fill: '#f00',
'stroke-width': 0
})
.animate({cx: 200, cy: 200}, 3000);
}
</script>
</head>
<body>
<div id="notepad"></div>
</body>
</html>