Sprite CSS inline dentro de artigos.

<style type="text/css"> 
    
	 #websites{
		background: url('images/sprite.png');
		background-position: 0px -210px; 
		width: 300px; 
		height: 200px;
	}
	#websites:hover{
		background: url('images/sprite.png');
		background-position: 0px -0px; 
		width: 300px; 
		height: 200px;
	}
	#sistemas{
		background: url('images/sprite.png');
		background-position: 0px -630px; 
		width: 300px; 
		height: 200px;
	}
	#sistemas:hover{
		z-index:
		background: url('images/sprite.png');
		background-position: 0px -420px; 
		width: 300px; 
		height: 200px;
	}
	#artes{
		background: url('images/sprite.png');
		background-position: 0px -1050px; 
		width: 300px; 
		height: 200px;
	}
	
	#artes:hover{
		background: url('images/sprite.png');
		background-position: 0px -840px; 
		width: 300px; 
		height: 200px;
	}
	#lojasvirtuais{
		background: url('images/sprite.png');
		background-position: 0px -1470px; 
		width: 300px; 
		height: 200px;
	}
	#lojasvirtuais:hover{
		background: url('images/sprite.png');
		background-position: 0px -1260px; 
		width: 300px; 
		height: 200px;
	}
	
	.float {
		
		float:left;
		padding:20px;
	}
	
</style> 

<div class="float"><div id="websites"> 
</div></div> 
<div class="float"><div id="sistemas"> 
</div></div> 
<div style="clear:both"> </div> 
<div class="float"><div id="artes"> 
</div></div> 
<div class="float"><div id="lojasvirtuais"> 
</div></div>
</div>
</div>