Home/ Questions/Q 7536365
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T06:33:17+00:00

code : <li> <a href=# id=CustomDecor> <ul id=sub_menu> <li><a href=# id=Carpets></a></li> <li><a href=# id=Storage_Solutions></a></li>

  • 0

code :

<li> 
    <a href="#" id="CustomDecor">
        <ul id="sub_menu">
            <li><a href="#" id="Carpets"></a></li>
            <li><a href="#" id="Storage_Solutions"></a></li>
            <li><a href="#" id="Flooring"></a></li>
            <li><a href="#" id="Interior_Painting"></a></li>
            <li><a href="#" id="Kitchen_Cabinet_Refacing"></a></li>
            <li><a href="#" id="Shutters"></a></li>
            <li><a href="#" id="Window_Treatments"></a></li>
            <li><a href="#" id="Window_Blinds"></a></li>
        </ul>
    </a>
</li>

Developer tools :

enter image description here

Why am I seeing extra elements? (under sub_menu and first li of sub_menu

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You cannot nest anchor (<a>) elements.
    On encounter of a new anchor tag, the browser attempts to fix the structure, possibly by closing the previous tag.

    Have a look at this simplified fiddle: http://jsfiddle.net/jZr3Z/

    <li> 
    <a href="#" id="CustomDecor">                  <----- Anchor 1
        <ul id="sub_menu">
            <li><a href="#" id="Carpets"></a></li> <----- Anchor 2
    • 0