Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

[CSS][Help] class inside class

1551254225
Sad
Sheet Author
API Scripter
<input type="radio" name="attr_tabcurrent" class="tabmain" value="tabmain" checked="checked" /> <span>主要</span> <input type="radio" name="attr_tabcurrent" class="tabadd" value="tabadd" /> <span>其他</span> <input type="checkbox" name="attr_setbuff_checkbox" class="sheet sheet-tab9 tabspell" title="Set Buff" /> <span>Buff</span> <input type="radio" name="attr_tabcurrent" class="tabconf" value="tabconf" /> <span>設定</span> <input type="checkbox" name="attr_configroll_checkbox" class="sheet sheet-tab8 tabspell" title="Config Roll" /> <span>私訊</span> <p /> <div class="sheet-sectiontab-setbuff"> <!-- config Tab --> <div class='myrow'> <h4 class="section-head"> <td><span>設定Buff</span></td> </h4> <input type="checkbox" name="attr_buffabilities_checkbox" class="sheet sheet-tab10 tabspell" title="Abilities" /> <span>屬性</span> <input type="checkbox" name="attr_buffskill_checkbox" class="sheet sheet-tab11 tabspell" title="Skill" /> <span>技能</span> <input type="checkbox" name="attr_buffdefense_checkbox" class="sheet sheet-tab12 tabspell" title="defense" /> <span>防禦</span> <input type="checkbox" name="attr_buffother_checkbox" class="sheet sheet-tab13 tabspell" title="Other" /> <span>其他</span> <p /> </div> </div> <div class="sheet-sectiontab-setbuff-abilities"> <!-- config Tab --> <div class='myrow'> <h4 class="section-head"> <td><span>私訊擲骰設定</span></td> </h4> <div class="section"> <table style="width:70%"> <tr> <td><input type="radio" name="attr_roll_display_to" value="/w gm " /> <span>所有擲骰結果私訊ST</span></td> <td><input type="radio" name="attr_roll_display_to" value="/w @{selected|token_name} " /> <span>所有擲骰結果私訊被選中的Token</span></td> <td><input type="radio" name="attr_roll_display_to" value="" checked="checked" /> <span>不進行私訊</span></td> </tr> <tr> <td><input type="radio" name="attr_roll_display_tell" value="/me 正在暗骰" /> <span>告訴大家我正在暗骰擲骰</span></td> <td><input type="radio" name="attr_roll_display_tell" value="/me @{roll_display_tell_enter}" /> <span>告訴大家...</span> <input type="text" style="width:40%;border: 1px solid;" name="attr_roll_display_tell_enter" value="" /></td> <td><input type="radio" name="attr_roll_display_tell" value="" checked="checked" /> <span>不告訴大家</span></td> </tr> <tr> <td colspan="3">立即私訊ST<input type="text" name="attr_text_kp_enter" style="width:40%;border: 1px solid;" /><button class='new-roll' type='roll' value='@{text_kp}@{text_kp_enter}' /></td> </tr> </table> </div> </div> </div> CSS .charsheet div[class^="sheet-sectiontab"] { display: none; } /*repeating buff*/ .charsheet input.sheet-tab9:checked ~ div.sheet-sectiontab-setbuff { display: block; } .charsheet input.sheet-tab10:checked ~ div.sheet-sectiontab-setbuff-abilities { display: block; } .charsheet input.sheet-tab11:checked ~ div.sheet-sectiontab-setbuff-skills { display: block; } .charsheet input.sheet-tab12:checked ~ div.sheet-sectiontab-setbuff-defense { display: block; } .charsheet input.sheet-tab13:checked ~ div.sheet-sectiontab-setbuff-others { display: block; } How to make sheet-sectiontab-setbuff-abilities display when the buffabilities_checkbox  sheet-tab10 checked?
1551259356
GiGs
Pro
Sheet Author
API Scripter
One way to do this is set a value="1" on the sheet-tab10 input  Add a copy of that input, with type="hidden" just before the div you want to hide In the CSS, use this: input.sheet-tab10[value="1"] ~ div.sheet-sectiontab-setbuff-abilities  Putting it together, this would make your html: <input type="radio" name="attr_tabcurrent" class="tabmain" value="tabmain" checked="checked" /> <span>主要</span> <input type="radio" name="attr_tabcurrent" class="tabadd" value="tabadd" /> <span>其他</span> <input type="checkbox" name="attr_setbuff_checkbox" class="sheet-tab9 tabspell" title="Set Buff" /> <span>Buff</span> <input type="radio" name="attr_tabcurrent" class="tabconf" value="tabconf" /> <span>設定</span> <input type="checkbox" name="attr_configroll_checkbox" class="sheet-tab8 tabspell" title="Config Roll" /> <span>私訊</span> <p /> <div class="sheet-sectiontab-setbuff">     <!-- config Tab -->     <div class='myrow'>         <h4 class="section-head">             <td><span>設定Buff</span></td>         </h4>         <input type="checkbox" name="attr_buffabilities_checkbox" class="sheet-tab10 tabspell" value="1" title="Abilities" />         <span>屬性</span>         <input type="checkbox" name="attr_buffskill_checkbox" class="sheet-tab11 tabspell" title="Skill" />         <span>技能</span>         <input type="checkbox" name="attr_buffdefense_checkbox" class="sheet-tab12 tabspell" title="defense" />         <span>防禦</span>         <input type="checkbox" name="attr_buffother_checkbox" class="sheet-tab13 tabspell" title="Other" />         <span>其他</span>         <p />     </div> </div> <input type="hidden" name="attr_buffabilities_checkbox" class="sheet-tab10 tabspell" title="Abilities" /> <div class="sheet-sectiontab-setbuff-abilities">     <!-- config Tab -->     <div class='myrow'>         <h4 class="section-head">             <td><span>私訊擲骰設定</span></td>         </h4>         <div class="section">             <table style="width:70%">                 <tr>                     <td><input type="radio" name="attr_roll_display_to" value="/w gm " />                         <span>所有擲骰結果私訊ST</span></td>                     <td><input type="radio" name="attr_roll_display_to" value="/w @{selected|token_name} " />                         <span>所有擲骰結果私訊被選中的Token</span></td>                     <td><input type="radio" name="attr_roll_display_to" value="" checked="checked" />                         <span>不進行私訊</span></td>                 </tr>                 <tr>                     <td><input type="radio" name="attr_roll_display_tell" value="/me 正在暗骰" />                         <span>告訴大家我正在暗骰擲骰</span></td>                     <td><input type="radio" name="attr_roll_display_tell" value="/me @{roll_display_tell_enter}" />                         <span>告訴大家...</span>                         <input type="text" style="width:40%;border: 1px solid;" name="attr_roll_display_tell_enter"                             value="" /></td>                     <td><input type="radio" name="attr_roll_display_tell" value="" checked="checked" />                         <span>不告訴大家</span></td>                 </tr>                 <tr>                     <td colspan="3">立即私訊ST<input type="text" name="attr_text_kp_enter"                             style="width:40%;border: 1px solid;" /><button class='new-roll' type='roll'                             value='@{text_kp}@{text_kp_enter}' /></td>                 </tr>             </table>         </div>     </div> </div> And the CSS div[class^="sheet-sectiontab"] { display: none; } /*repeating buff*/ input.sheet-tab9:checked ~ div.sheet-sectiontab-setbuff { display: block; } input.sheet-tab10[value="1"] ~ div.sheet-sectiontab-setbuff-abilities { display: block; } input.sheet-tab11:checked ~ div.sheet-sectiontab-setbuff-skills { display: block; } input.sheet-tab12:checked ~ div.sheet-sectiontab-setbuff-defense { display: block; } input.sheet-tab13:checked ~ div.sheet-sectiontab-setbuff-others { display: block; } Note: I removed some css elements/ You don't need the .charsheet at the start of each css element, and you dont need "sheet " in the style of any of your inputs.
1551281695
Sad
Sheet Author
API Scripter
Thankyou very much