pinkRobot435
pinkRobot435

Reputation: 43

Background-image in div not repeating?

I'm having trouble getting an image to repeat in HTML/CSS. I'm very new to this so I might have made a basic mistake but I can't for the life of me figure out what it is.

I've made a div in my index.html

    ...
  <body>
     <div class="bakgrund"></div>
  </body>
    ...

And my CSS-file:

    .bakgrund {
  background-image: url("img/bakgrund.png");
  height: 200px;
  width: 200px;
}

The image is displayed but only once. What I want to do is for the image to repeat vertically and horizontally. This works perfectly when I define the background image in the body tag and not as a div, is it possible?

Upvotes: 0

Views: 1093

Answers (3)

Md Nazmul Hossain
Md Nazmul Hossain

Reputation: 99

Add this line to your CSS file

background-repeat: repeat;

Upvotes: 1

BTSM
BTSM

Reputation: 1663

If your background image size large than div size please set the background size like this.

.bakgrund {
    background-image: url("https://www.w3schools.com/cssref/paper.gif");
    background-repeat: repeat;
    height: 200px;
    width: 200px;
    background-size: 20px 20px;
}
<body>
     <div class="bakgrund"></div>
  </body>

Upvotes: 2

Rizwan
Rizwan

Reputation: 4433

The default value of background-repeat is already repeating but if if you need to repeat the background image by css in ...? try this

.bakgrund {
    background: url("img/bakgrund.png") repeat;
    height: 200px;
    width: 200px;
}

Upvotes: 1

Related Questions