Background image opacity in Servoy 6

[Ugo]

Hello,

How would I do to set the opacity of a background image defined for the body part of a form without affecting other elements on that form ?
I tried several settings through my css stylesheet, but I can"t find a way around, everything on that form is rendered opaque.

Here's where I am so far

Code: Select all

   body.bkgrd{

           background-image: url("media:///myimage.jpg");
            background-color: grey;
            background-color : rgba(1,1,1,0.1);
            opacity: 0.4;
            background-repeat:no-repeat;
            background-position: center;
            background-size: cover;

      }


Thanks

[david]

The opacity property by definition applies to the block element, not the background image. What you need is a background-opacity property but it doesn't exist yet.

The solution is to put a label on your form that fills the body part (with anchors as needed), send it to the back, and set its style class to:

Code: Select all

label.img-background {
   background-image: url("media:///myimage.jpg");
   background-color: grey;
   background-color: rgba(1, 1, 1, 0.1);
   opacity: 0.1;
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
}

[Ugo]

Thank you David,

that's the solution I came up with also

Ugo