Difference between revisions of "ARIA Group role"

From Level Access Web Labs
Jump to navigation Jump to search
Line 8: Line 8:
 
   <label><input type="radio" id="r3" name="a"> Linux </label>   
 
   <label><input type="radio" id="r3" name="a"> Linux </label>   
 
</div>
 
</div>
 
<button> Nothing </button>
 
  
 
<div role="group" aria-labelledby="s2" aria-label="Billing Address aria label">  
 
<div role="group" aria-labelledby="s2" aria-label="Billing Address aria label">  
Line 18: Line 16:
 
</div>
 
</div>
  
 +
<br><br><br>
  
 
<br><br><br>
 
 
<h3> Fieldset and Legend tag with H2 inside legend</h3>
 
<h3> Fieldset and Legend tag with H2 inside legend</h3>
 
<fieldset id="feedbackIntro">
 
<fieldset id="feedbackIntro">
<legend><H2> Was this content helpful? </H2></legend>
+
  <legend>
<button id="feedbackYes" class="feedbackHelpful" title="Yes" data-value="yes">Yes</button>
+
    <h2> Was this content helpful? </h2>
<button id="feedbackNo" class="feedbackHelpful" title="No" data-value="no");">No</button>
+
  </legend>
 +
  <button id="feedbackYes" class="feedbackHelpful" title="Yes" data-value="yes">Yes</button>
 +
  <button id="feedbackNo" class="feedbackHelpful" title="No" data-value="no");">No</button>
 
</fieldset>
 
</fieldset>
  
 
<br><br><br>
 
<br><br><br>
<h3> Fieldset and Legend tag with H2 outside the legend</h3>
+
<h3> Fieldset and Legend tag with H2 wrapping the legend</h3>
 
<fieldset id="feedbackIntro">
 
<fieldset id="feedbackIntro">
<H2><legend> Was this content helpful? </legend></H2>
+
  <h2>
<button id="feedbackYes" class="feedbackHelpful" title="Yes" data-value="yes">Yes</button>
+
    <legend> Was this content helpful? </legend>
<button id="feedbackNo" class="feedbackHelpful" title="No" data-value="no");">No</button>
+
  </h2>
 +
  <button id="feedbackYes" class="feedbackHelpful" title="Yes" data-value="yes">Yes</button>
 +
  <button id="feedbackNo" class="feedbackHelpful" title="No" data-value="no");">No</button>
 
</fieldset>
 
</fieldset>
  
 
<br><br><br>
 
<br><br><br>
<h3> Regular Fieldset and Legend tag</h3>
+
<h3> Regular Fieldset and Legend tag (no heading)</h3>
 
<fieldset id="feedbackIntro">
 
<fieldset id="feedbackIntro">
<legend> Was this content helpful?</legend>
+
  <legend> Was this content helpful?</legend>
<button id="feedbackYes" class="feedbackHelpful" title="Yes" data-value="yes">Yes</button>
+
  <button id="feedbackYes" class="feedbackHelpful" title="Yes" data-value="yes">Yes</button>
<button id="feedbackNo" class="feedbackHelpful" title="No" data-value="no");">No</button>
+
  <button id="feedbackNo" class="feedbackHelpful" title="No" data-value="no");">No</button>
 
</fieldset>
 
</fieldset>
  

Revision as of 14:57, 11 May 2016

ARIA role group example with input type radio.

Platform:
Billing Address:




Fieldset and Legend tag with H2 inside legend

Was this content helpful?




Fieldset and Legend tag with H2 wrapping the legend

Was this content helpful?




Regular Fieldset and Legend tag (no heading)

Was this content helpful?