Skip to main content
C
Christian_S1-Visitor
1-Visitor
June 28, 2019
Solved

Image Custom CSS

  • June 28, 2019
  • 1 reply
  • 1324 views

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

Best answer by Christian_S

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%);
}

1 reply

C
Christian_S1-VisitorAuthorAnswer
1-Visitor
June 28, 2019

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%);
}
Terms & ConditionsAccessibility statement