Werewolf the Apocalypse sheet

I'm modding the existing Werewolf the Apocalypse sheet mainly doing some visual changes. In all World of Darkness games you have attributes that ranges from 1-10, the value is shown as circles and then under those you have boxes which stand for that number of points you have left - e.g you have a Willpower of 7 and have spent 3. 7 circles are filled in and 3 boxes. In the Werewolf the Apocalypse 20th ed sheet both value and spend value is shown as circles. So that is something I want to fix. I have checked the code and compared with the Mage the Ascension sheet finding the code to - from what I can see - be identical. So my question is - what turn a radio input to mimic a checkbox in CSS? Mainly so I can easier find what the error is as at the moment I'm stuck.

The usual method is to make the checkbox invisible and then create a <span> over it that have the correct visuals. Pretty sure you could find examples of this method in any of the WoD sheet existing on Roll20.

Hi Johan, maybe this example from CSS Wizardry might help?&nbsp;&nbsp;<a href="https://wiki.roll20.net/CSS_Wizardry#Fill_Radio_Buttons_to_the_Left" rel="nofollow">https://wiki.roll20.net/CSS_Wizardry#Fill_Radio_Buttons_to_the_Left</a>

Vince said: Hi Johan, maybe this example from CSS Wizardry might help?&nbsp;&nbsp; <a href="https://wiki.roll20.net/CSS_Wizardry#Fill_Radio_Buttons_to_the_Left" rel="nofollow">https://wiki.roll20.net/CSS_Wizardry#Fill_Radio_Buttons_to_the_Left</a> I know you meant to link to section above :D <a href="https://wiki.roll20.net/CSS_Wizardry#Alternative_Checkboxes" rel="nofollow">https://wiki.roll20.net/CSS_Wizardry#Alternative_Checkboxes</a>

I wasn't sure since Johan asked about mimicking a checkbox using a radio, but filling in the circles was also mentioned...&nbsp; At any rate, CSS Wizardry is the bomb. ;-)