CODEWITHSUNDEEP
htmlcss
Kyle Schmelzer
Kyle Schmelzer

Reputation: 153

background image is repeating, cant code it to stop

I need to get the background image in this page to show only once, no repeat, and to be centered, and about 500px down the page. I cant seem to write the code correctly. I know it's something like "background-image: norepeat", checked the WC3 page, it gave me some stuff, but it only broke the picture and it didnt show at all.

Here's the CSS part:

#wrapper {
width: 700px;
margin: 0 auto;
background-color: #d7fdc9;
padding-top: 20px;
padding-bottom: 20px;
background-image: url(../images/bkgd-image.gif);
}

Im unsure if you need the full HTML and CSS, so i just posted the small tidbit, cause i cant imagine you needing more.

If you do need it all, lmk, and ill post it. Ty!

Upvotes: 2

Views: 174

Answers (4)

TheSmile
TheSmile

Reputation: 360

Try insert background-repeat: no-repeat; into your css.

If you want create full page background : Try this

html {
  background: url(images/bg.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

Upvotes: 0

Vicky Thakor
Vicky Thakor

Reputation: 3916

Use background-repeat: no-repeat; instead background-image: norepeat

body {
    background-image: url('paper.gif');
    background-repeat: no-repeat;
}

Read more about property on W3School: http://www.w3schools.com/cssref/pr_background-repeat.asp

Upvotes: 0

chris
chris

Reputation: 2951

background: #d7fdc9 url(../images/bkgd-image.gif) no-repeat center 500px;

or the long way

background-image: url(../images/bkgd-image.gif);
background-repeat:no-repeat;
background-position:center 500px;
background-color:#d7fdc9;

and give your wrapper a height if it has nothing in it.

Upvotes: 4

Chun
Chun

Reputation: 2270

yeah maybe you're writing it wrong, it is:

background-image:url('../images/bkgd-image.gif');
background-repeat:no-repeat;

Upvotes: 0

Related Questions