CODEWITHSUNDEEP
cssbackgroundbackground-imagerepeat
Egidi
Egidi

Reputation: 1776

CSS repeat a background image after a background image finishes

I need to use a static no-repeating background image on my website, but when the image finishes (vertically), i need to use repeatedly another image. How could this be done?

For the first image should be something like:

background:url(../img/header/main_bg01.jpg) no-repeat top center;

But for the second one, vertically after the first one, should do somehting like:

background:url(../img/header/main_bg02.jpg) repeat top center;
background-repeat: repeat-y;

How could this be done?

Regards,

Upvotes: 1

Views: 287

Answers (1)

Etheryte
Etheryte

Reputation: 25310

Use multiple backgrounds on the same element (adjust sizes to your needs):

background: 
   url(bg1.png) 500px 100px no-repeat,
   url(bg2.png) 50px 100px repeat;

Upvotes: 2

Related Questions