Background image and color fill

  background-color: #7f7f7f;
  background-image: url('../mytheme/images/myimage.png');
  background-repeat: no-repeat;
  background-size: 50px 50px;
  background-position: 4px 4px;

Displaying An Image At A specific Postiion In The Background

#header .pad {
	background: url('/images/my-logo-header.png') no-repeat;
	background-size: 50px 100px;
	background-position: 0px 10px; 
	height: 120px;		
}

Displaying An Image Offset From Right Edge

#header .pad {
	background: url('/images/my-logo-header.png') no-repeat;
	background-size: 50px 100px;
	background-position: top 0px right 10px; 
	height: 120px;		
}

Multiple Background Images

body {
	background-image: url(/images/background_header.png), url(/images/background_footer.png);
	background-position: top left, bottom left;
	background-repeat: repeat-x, no-repeat;
	background-size: 1px 196px, 1px 108px;
}
Feel free to comment if you can add help to this page or point out issues and solutions you have found. I do not provide support on this site, if you need help with a problem head over to stack overflow.

Comments

Your email address will not be published.