How to present body background image above content

0 Views

i am working on this website (builted with WordPress) and i am trying to set this image as a fixed left background above the entire website content.

Via CSS i’m trying this

Read More
body { 
background-image: url("http://birsmatt.ch/de/wp-content/uploads/2016/04/bg_left.png"); 
background-position: left; 
background-repeat: no-repeat; 
z-index: 1; 
}

…but the z-index does not works.

Any tip?

Thanks in advice.

Post Views: 0

Related posts

1 comment

  1. Inside the body is your whole website content. So if you set a background, it will be behind all the content of the body.

    You can create a new element inside the body with the size of the body and give that the background you want.

    Example:

    #background {
  background-image:url('http://birsmatt.ch/de/wp-content/uploads/2016/04/bg_left.png');
  background-position:left;
  background-repeat:no-repeat;
  
  height:100%;
  width:100%;
  z-index:1;
  position:absolute;    /* make it overlap your website content */
}
    <body>
  
  <div id='background'></div>
  
  <div id='rest of your content'>
    ...
  </div>

</body>

Comments are closed.