I'm running my website through the W3C Markup validator and I'm getting the following error:

The aria-controls attribute must point to an element in the same document. …"ui-accordion-1-header-2" aria-controls="ui-accordion-1-panel-0" tabindex="0">

I've read through the documentation and I not sure where I'm going wrong.

My HTML looks like this:

<ul class="mobile-primary ui-accordion ui-widget ui-helper-reset" role="tablist">
    <li><a class="mobile-tab-trigger ui-accordion-header ui-helper-reset ui-state-default ui-corner-all ui-accordion-icons" href="#" role="tab" id="ui-accordion-1-header-0" aria-controls="ui-accordion-1-panel-0" aria-selected="false" tabindex="0"><span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>Link 1</a>    
        <ul class="mobile-secondary mobile-expand ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" id="ui-accordion-1-panel-0" aria-labelledby="ui-accordion-1-header-0" role="tabpanel" aria-expanded="false" aria-hidden="true" style="display: none;">
            <li><a href="/Link2/" title="Link 2">Link 2</a></li>

As you can see I have aria-controls="ui-accordion-1-panel-0" and the subsequent <ul> tag is id="ui-accordion-1-panel-0".

  • Testing that snippet by direct input seems to work for me, can you provide a link to the page you're trying to validate? x – Emily Shepherd Apr 3 '14 at 15:16
  • What HTML doctype are you using? The validity may depend on that. – Stephen Ostermiller Dec 20 '14 at 12:14
  • I'm having the exact same issue, using HTML5 doctype. Error message is stating the same, except I'm targeting classes. – Lee Jul 22 '16 at 9:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.