cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
Showing results for 
Search instead for 
Did you mean: 

Image Custom CSS

SOLVED
Highlighted
Regular Member

Image Custom CSS

I want to make an image blackandwhite by CSS. Now I am trying to get a custom css work.

I made a CSS-class which works if i put it on the "img" type.

To get it work on the specific Image-Widget I need the correct selectors to reach the img.

Is there a documentation anywhere which selectors are available on which widget, therefore I don't have to go vie webdebugger and try all combinations?

 

.img_blackwhite .widget-image {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}

But when I apply "img_blackwhite" as custom class on my image-widget it doesn't work. Are the selectors correct?

I also realized in the webdebugger that my style class is not applied anywhere. It was added to the dom under "mashup-styles" but not added to any element in the dom.

Can you help here?

 

Thanks in advance

Tags (3)
1 ACCEPTED SOLUTION

Accepted Solutions

Re: Image Custom CSS

I found my solution...

 

It seems to be not allowed to use an underscore in the styleclass name. After removing it the styling worked as intended.

 

.imgblackwhite {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}

View solution in original post

1 REPLY 1

Re: Image Custom CSS

I found my solution...

 

It seems to be not allowed to use an underscore in the styleclass name. After removing it the styling worked as intended.

 

.imgblackwhite {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}

View solution in original post