[Snippet] CSS3 Keep ratio for background

Mods, snippets and styles postet and supported by the users
Forum rules
As the forum title says this is for User Contributions
Post a support request in this forum and you will be banned!
Locked
User avatar
FTH
BBCoder III
BBCoder III
Posts: 124
Joined: 25 Nov 2011, 23:28
BBCodes: 10
Contact:

[Snippet] CSS3 Keep ratio for background

Post by FTH »

Author : FTH
Description : Keep the ratio (width/height) for background (only for browsers supported CSS3)

Example :

You want to add an image to your background on your board... Upload a large image (2560*1600 for my example)

Open file styles/prosilver/theme/colours.css

Find :

Code: Select all

html, body {
	color: #536482;
	background-color: #FFFFFF;
}
Replace with :

Code: Select all

html, body {
	color: #536482;
	background-color: #FFFFFF;
	background-size: cover;
	background-position: center center;
	background-image: url("{T_THEME_PATH}/images/your_image.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
}
Change "your_image.jpg" by your image !!!
Locked