How to make the whole area of a list item in my navigation bar, clickable as a link with CSS?

To make the whole area of a list item in my navigation bar, clickable as a link with CSS, we make the links display as list items.

For instance, we write

<div id="nav">
  <img src="/images/renderedicon.png" alt="Icon" height="57" width="57" />
  <ul>
    <li><a href="#">One1</a></li>
    <li><a href="#">Two</a></li>
    <li><a href="#">Three</a></li>
    <li><a href="#">Four</a></li>
  </ul>
</div>
<div>
  <h2>Heading</h2>
</div>

to add the ul with the li elements.

Then we write

a {
  display: list-item;
  list-style-type: none;
}

to make the links display as list items with display: list-item;

And we remove the bullets with list-style-type: none;.