Been using Vantage exclusively! Thanks for a great template.
Please see http://farmingfoodie.com
As you can see the Page background image is repeating horizontally and vertically. I’d like to somehow set it to 100% since I’m using Full Width layout.
I’ve added the following CSS:
/* Set Background Image to NoRepeat */
body {
background-color: #46913f;
background-image: url("http://farmingfoodie.com/wp-content/uploads/2014/08/background-artwork2.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
}Any suggestions? Hope next versions allow control of this :)
Hi Deborah
You should be able to achieve this with background-size: cover. So your CSS will look something like this.
body { background-color: #46913f; background-image: url("http://farmingfoodie.com/wp-content/uploads/2014/08/background-artwork2.jpg"); background-repeat: no-repeat; background-attachment: fixed; background-position: center; background-size: cover; }You can read a little more on this property here: http://www.w3schools.com/cssref/css3_pr_background-size.asp
This would be a good thing to add in a future update. I’ll take a look at whether this is possible.
I put your code into my css but no change in background. Also added:
tml{
height:100%;
min-height:100%;
}
body{
min-height:100%;
}
/* Set Background Image to NoRepeat */
body {
background-color: #46913f;
background-image: url(“http://farmingfoodie.com/wp-content/uploads/2014/08/background-artwork2.jpg”);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
background-size: cover;
}
Any thoughts?
html{
height:100%;
min-height:100%;
}
body{
min-height:100%;
}
To clarify, the background image should cover the width and not repeat so the background color fills the screen under the photo..
Here’s a same site:
http://latinroguecleaning.com/
Lets close this thread.
Couldn’t do this – tried everything and eventually lost the client.