Background-size: cover is cutting off my image on larger screens
background-image, css
Solution
-moz-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
background-size: 100% 100%;
Will fix it, but the images will become stretched/squashed because you have a fixed height but a variable width.
Problem
I have site that I'm laying out. It's basically Header, Content and Footer all 100% width. I want to have the background image fill the screen in the content section. I achieved this with the CSS3 background-size:cover. The only problem when Im scaling up to a screen that is 2560px the image gets cut off. Is there a way to work around this so that doesn't happen? My CSS ``` #maincontentcontainer { width: 100%; background-image: url(../images/sandpiperBG.jpg); background-position:center center; background-repeat:no-repeat; -moz-background-size:cover; -webkit-background-size:cover; background-size:cover; } ```