set opacity in custom panels

  • 1
  • Question
  • Updated 4 years ago
  • Answered
Been browsing the Yola Forum for an answer but haven't been able to find it, so here goes:

Is there a way to set the opacity of the custom panel?

I have tried to locate the div in firebug and have used the following css:

div#="yola-panel-I100" {
  opacity: 0.5;
}

This isn't working though, so i either have the wrong div or the wrong code..

Anyone an idea of how else to do it?

Cheers,
Saskia
Photo of Saskia

Saskia

  • 110 Posts
  • 11 Reply Likes
  • unsure

Posted 4 years ago

  • 1
Photo of Monique

Monique, VP of Customer Support

  • 6294 Posts
  • 446 Reply Likes
Hi Saskia

I have a way that doesn't involve CSS.  Got the idea from Kanthaidecor :).  You go to a site such as: http://www.1x1px.me/.  Set the hex value and opacity and download your pixel.  In the custom panel widget, remove the background color and instead upload the pixel as a background image.  It will tile automatically, creating a translucent background. 

I have used it throughout my site: http://indabacounselling.co.uk if you want to see it in action.

Hope this helps!
(Edited)
Photo of Saskia

Saskia

  • 110 Posts
  • 11 Reply Likes
Thank you Monique, sounds good and will try it out tomorrow :)
Photo of Saskia

Saskia

  • 110 Posts
  • 11 Reply Likes
Perfect!! :D

Can't believe i never thought of just creating an image with an opacity...DUH!  In future i will either use your link or just make a transparent box in Photoshop . Easy :)
(Edited)