/    Sign up×
Community /Pin to ProfileBookmark

beginner problem: background image cover value doesn’t work

Copy linkTweet thisAlerts:
Feb 08.2015

Hello everyone. I have problem with background image. Below is my code but it doesn’t work properly. The picture doesn’t cover screen entirely, top and bottom of an image is not visible. Also if I remove background-position: center, only the top part of the image is visible. Can anyone help me on this?

The size of an image is: 3149×2381

[CODE]
body{
background: url(“img/yacht.jpg”) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

[/CODE]

to post a comment
CSS

1 Comments(s) ↴

Copy linkTweet thisAlerts:
@jedaisoulFeb 08.2015 — Welcome to the forums...

That is what "cover" does. Try using [b]background-size: auto 100%;[/b] or, perhaps, [b]background-size: 100% auto;[/b]. One or other may be closer to what you wanted...

Oh, and by the way, your huge graphic is a definite nono. Even with cable, wifi limits the bandwidth for many users, and not everyone has cable anyway!
×

Success!

Help @tamta spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...