Rolltemplate styling not registering?

Back with another question! I have been attempting to create a custom roll template for the last hour or so, but have not been able to get ANY styling to show up in the Sandbox. I feel like I have read the documents  here  and  here  up and down to no avail.  I have made a very simple test example, which I can't even get to work. Template (at the end of the charactersheet, this part works) <rolltemplate class="sheet-rolltemplate-test"> <div> {{A}}<br /> {{B}} </div> </rolltemplate> The style (at the end of the character sheet css file) .sheet-rolltemplate-test div { font-size: 24px;     color: red; } The roll macro (in a roll-type button) &{template:test} {{A=test}} {{B=test2}} This is what I see in chat And in the "debug" window in chrome See "element.style {}" is empty, no styling is applied. What am I doing wrong?

The styling won't be applied to element.style; that's where inline styling (styling written directly in the html) is shown. It still looks like it's not being applied though because you should see that exact css declaration in the list of css declarations. Check your console log and see if you've got an error saying that a security violation was detected and the css was thrown out. This happens when banned words are present in the css; including present in words (e.g. "medieval" can't be used because it contains"eval"). The complete list of banned words can be found on the wiki .

I did have this content: " \2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219\2009\2219 "; used to create a horizontal dotted line, which was generating a warning message in the console. But all other CSS have been working all the while, and taking it out removed the warning message from the console, it didn't fix the missing CSS for the template. I just tried to only put in the above codes and nothing else, and now it does work. So something else must be breaking it. I'll try to do some debugging

If it's interpreting those characters as UTF characters, that'll break the CSS. Don't put emojis or anything like that in the CSS. :-/

I did a bit of testing and this works: .sheet-rolltemplate-test div { font-size: 24px; color: red; } but including just this one line above (see code box below) which is supposed to style a button in a repeaing section make it fail immediately, why? div.reputation-container div.repcontrol button.btn:hover { background-color: #C8C8AA; } /************************************* roll-templates *************************************/ .sheet-rolltemplate-test div { font-size: 24px; color: red; } edit: the first code box was actually wrong, I just noticed

I think I have found the problem! The sheet breaks because of the CSS comment block. But ONLY the rolltemplate part breaks, for whatever reason

More specifically, this breaks /* * */ So, no asterisks in CSS comment blocks apparently

Sadly, this has been brought up before. from <a href="https://wiki.roll20.net/BCS/Bugs" rel="nofollow">https://wiki.roll20.net/BCS/Bugs</a> Asterisks disappearing from CSS comments. examples &amp; discussion (Forum) Chris D. may have uncovered strange behavior with CSS comments using multiple asterisk characters. eg /******/ Scott C. notes that this may be an older bug [1] and suggests to use # instead. eg /*######*/ details &amp; summary -element styling is inconsistent between browsers/versions details (Forum) April 2021