norepeatsetting_nopositionset
repeat-y_nopositionset
norepeat_positionset
repeat-x_positionset
/* This CSS means the bg image tiles as normal (both x and y)
          given the size of the image and the div  */
          
#norepeatsetting_nopositionset   
	{                              
		position: absolute;
		top: 20px;
		left: 30px;
		width: 300px;
		height: 300px;
		color: #003366;
		background-color: #666666;
		background-image: url(robynlion.jpg);

	}
	
	
	
/* This CSS means the bg image tiles y, and starts at normal position. 
          Extra fun: CSS border settings for the div. */
          
#repeat-y_nopositionset    
{                            
	position: absolute;
	top: 20px;
	left: 390px;
	width: 150px;
	height: 500px;
	color: #003366;
	background-color: #000000;
	background-image: url(robynlion.jpg);
	background-repeat: repeat-y;
	border-width: thin;
	border-color: black;
	border-style: solid;
	padding-left: 10px;
	
}



/* This CSS means the bg image does not tile. background-position settings
          effectively center bg image based on size of image and size of div */

#norepeat_positionset   
	{                        
		position: absolute;
		top: 350px;
		left: 30px;
		width: 300px;
		height: 300px;
		color: #003366;
		background-color: #666666;
		background-image: url(robynlion.jpg);
		background-repeat: no-repeat;
		background-position: 50px 50px;
		border-width: thin;
		border-color: black;
		border-style: solid;
	}
	
	

/* This CSS means the bg image repeats x, but background-position settings start 
          the bg image lower than normal, and further left than normal. */

#repeat-x_positionset   
{                            
	position: absolute;
	top: 540px;
	left: 390px;
	width: 450px;
	height: 150px;
	color: #003366;
	background-color: #eeeeee;
	background-image: url(robynlion.jpg);
	background-repeat: repeat-x;
	background-position: -45px 30px;
	border-width: thin;
	border-color: black;
	border-style: solid;
	padding-left: 10px;
}