Need Help with Putting Tabs on My Custom Sheet

I'm just now learning how to make a character sheet. The current work is quite rough, not very pretty, and hopefully it will function, but the system for which I'm developing it needs a lot of different sets of information. It's a Roll20 sheet for an in-development Kingdom Hearts Tabletop RPG, and I would like it to contain six tabs: Combat Stats, Equipment, Inventory, Abilities, Commands, and Spells. My goal is to have those six tabs exist underneath a set of basic information. Could someone help me by posting the appropriate HTML and CSS coding, just to make the radio buttons and have them work?

This is based on how I do it for one of my custom systems. No idea if this is the optimal way to go about it. HTML would look something like this: <input type="radio" name="attr_tab" class="sheet-tab1" value="1" checked="checked">Combat Stats <input type="radio" name="attr_tab" class="sheet-tab2" value="2">Equipment <input type="radio" name="attr_tab" class="sheet-tab3" value="3">Inventory <input type="radio" name="attr_tab" class="sheet-tab4" value="4">Abilities <input type="radio" name="attr_tab" class="sheet-tab5" value="5">Commands <input type="radio" name="attr_tab" class="sheet-tab6" value="6">Spells Then the CSS: div.sheet-combat, div.sheet-equipment, div.sheet-inventory, div.sheet-abilities, div.sheet-commands, div.sheet-spells { display: none; } input.sheet-tab1:checked ~ div.sheet-combat { display: block; } input.sheet-tab2:checked ~ div.sheet-equipment { display: block; } input.sheet-tab3:checked ~ div.sheet-inventory { display: block; } input.sheet-tab4:checked ~ div.sheet-abilities { display: block; } input.sheet-tab5:checked ~ div.sheet-commands { display: block; } input.sheet-tab6:checked ~ div.sheet-spells { display: block; } So you'd just wrap all of the tabbed information in a div of the proper class (sheet-combat, sheep-equipment, etc).

Moved to Character Sheets. Lots of good info here:&nbsp;<a href="https://app.roll20.net/forum/post/882997/css-wizardry/?pagenum=1" rel="nofollow">https://app.roll20.net/forum/post/882997/css-wizardry/?pagenum=1</a>

Thank you both. I've read through the CSS Wizardry post (and the corresponding Wiki page), but I couldn't get it to work right.