How to properly display HTML with custom CSS

[misici234]

Here is the HTML

gAssessGreater <span class="pn-status" style="background-color:#FF0000;"></span>

where pn-status is

#legend span, .pn-status {
  height: 10px;
  width: 10px;
  display: inline-block;
}

I have to display it like this

How can I do it? I don't know. Please help.

[tneotia]

Something like this is not possible, we do not support rendering with empty span. Span expects text inside of it at the moment.

However you can use the customRender API to detect the span and class name, and then render the red box on your own.

[erickok]

Yes I quickly tried this and while release 2.2.0 support height/width css properties you'd need to apply it on some custom tag or use the custom render feature.