Fill radio buttons to the left behaviour in different divs

Hello everyone! I'm building a character sheet for Cyberpunk 2020 (a practice in preparation for Cyberpunk RED) system and want to utilize "fill radio buttons to the left" tip from CSS Wizardry wiki page (great work on that whole thing btw). The problem is, my page's layout is built on grid and blocks of 4 radio buttons are separated into different divs:&nbsp; &lt;div class="wounds"&gt; &lt;div class="wounds-block"&gt; &lt;div&gt;Light&lt;/div&gt; &lt;div class="wounds-radio-block"&gt; &lt;input type="radio" class="wound-radio" name="attr_wounds" checked="checked"/&gt;&lt;span&gt;&lt;/span&gt; &lt;input type="radio" class="wound-radio" name="attr_wounds"/&gt;&lt;span&gt;&lt;/span&gt; &lt;input type="radio" class="wound-radio" name="attr_wounds"/&gt;&lt;span&gt;&lt;/span&gt; &lt;input type="radio" class="wound-radio" name="attr_wounds"/&gt;&lt;span&gt;&lt;/span&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="wounds-block"&gt; &lt;div&gt;Serious&lt;/div&gt; &lt;div class="wounds-radio-block"&gt; &lt;input type="radio" class="wound-radio" name="attr_wounds"/&gt;&lt;span&gt;&lt;/span&gt; &lt;input type="radio" class="wound-radio" name="attr_wounds"/&gt;&lt;span&gt;&lt;/span&gt; &lt;input type="radio" class="wound-radio" name="attr_wounds"/&gt;&lt;span&gt;&lt;/span&gt; &lt;input type="radio" class="wound-radio" name="attr_wounds"/&gt;&lt;span&gt;&lt;/span&gt; &lt;/div&gt; &lt;/div&gt; ...8 more wounds-blocks Styles proposed in CSS Wizardry work fine for one block, but do not affect other blocks - the radios stay checked, as per general style for them. So my question is, is it even possible to implement desired behaviour for such a layout? Or should I develop a new approach for this section for it to work? Other alternative is to dump all this work on Sheet Worker, which might be simplier than trying to style it into oblivion %) Whole code and styles can be found here&nbsp; <a href="https://github.com/StoumTheCat/roll20-character-sheets" rel="nofollow">https://github.com/StoumTheCat/roll20-character-sheets</a> &nbsp;under cyberpunk2020-by-stoum branch

First, one remark: your radios will need "value" attributes (all different) if you want them to work correctly, but you probably knew this. Second, about your main question: yes, it's possible. There's&nbsp; three ways I can see: Put all the radios in one container and use CSS to style it correctly. However, it depends a lot on what this is supposed to look like to determine how much work this will be. Do you have a screenshot or mock for the target layout? Use a sheetworker to trigger an invisible checkbox at the beginning of each wounds-radio-block. Easy, but there will be a weird delay between clicking and style change due to the sheet worker. Use tons of invisible checkboxes to simulate all possible earlier boxes. Basically all the downsides of 2., and the total number of checkboxes is O(#blocks*#radios), so... don't do this. Works without sheet workers.

Thanks for the reply, Jakob. Yes, I know that I need values on radios for the actual attribute to work with all logic stuff for the sheet, but I'm just in the process of creating the layout for now. I think I'll just settle for single checked radio, it's just not really worth it to put so much time into (although nice) cosmetic feature. For now it looks like this:&nbsp;

Unrelated to the starting subject, I think another nice feature worth adding tutorial on to Building Character Sheet/CSS Wizardry articles is expanding blocks on repeating sections like on official 5e DnD repeating_attack block. I had to scavenge for it in the code :)&nbsp;

Stoum said: Unrelated to the starting subject, I think another nice feature worth adding tutorial on to Building Character Sheet/CSS Wizardry articles is expanding blocks on repeating sections like on official 5e DnD repeating_attack block. I had to scavenge for it in the code :)&nbsp; The technique is the same as the tabbed sheet method outlined in the wiki, just with the tab control button in a different place.