您可以将样式设置为

a {
  display: block;
  height: 100%
}

或

li {
  display: flex;
}

你应该把a标签放在img后面

<address>
      <ul>
        <li class="">
          <a href="12345"><img src="./img/phone.svg"  /></a><span>Phone</span>
            <p>+1 (234) 567-89-00</p>
          
        </li>
        <li class="">
          <a href="email@email"><img src="./img/email.svg" /></a><span>Email</span>
            <p>email@email</p>
          
        </li>
        <li class="">
          <a href="my streeet"><img src="./img/address.svg"/></a><span>Address</span>
            <p>street</p>
        </li>
      </ul>
    </address>

或者你可以删除a标签，没有a标签图片也能正常工作，但是img就不能被点击了

默认情况下，li不可单击。您可以使用javascript或将height: 100%;和display: block;添加到a来解决此问题。

只要给予a标签100%的宽度和高度，它将占据li的所有空间，li将成为可点击的，另一种方法是，只要删除li和直接插入一个标签。

ul {
      display: flex;
      text-align: center;
      justify-content: center;
      list-style: none;
      padding-left: 0;
    }
    
    li {
      width: 400px;
      border: 1px solid red;
    }
    
    li a {
      position: relative;
      display: block; 
      width: 100%;
      height: 100%;
      border: 1px solid green;
    }

<address>
      <ul>
        <li class="">
          <a href="12345"><img src="./img/phone.svg"  /><span>Phone</span>
            <p>+1 (234) 567-89-00</p>
          </a>
        </li>
        <li class="">
          <a href="email@email"><img src="./img/email.svg" /><span>Email</span>
            <p>email@email</p>
          </a>
        </li>
        <li class="">
          <a href="my streeet"><img src="./img/address.svg"/><span>Address</span>
            <p>street</p>
          </a>
        </li>
      </ul>
    </address>

此问题已得到答复here
对于那些不想去那里看的人，这里有答案

<li onclick="location.href = '';">Make A List Item Clickable</li>

list元素支持onclick事件。
对于您的情况，只需删除<a>元素并将其替换为文本节点或<p>