clickable list of divs in html/css -

i want make horizontal list of divs clickable. got this:

<div id="header">     <a href="/"></a>         <ul id="list">             <li id="column1">                 <div></div>             </li>             <li id="column2">                 <div></div>             </li>            </ul>    </div> 

styles:

#header {     height: 200px;     width:500px; }  a{   display: block;   width: 100%;   height: 100%; } 

the problem is,an "a" element not in same place list, , want list cliackable.

if want clickable on page use javascript event listeners not anchor tags.

when want element clickable add event listener click action on client code , define behaviour of object.

use anchor tags if object's behaviour link place.

this make code cleaner , easier read, easier place every object want be.