[対処療法] aタグ内にimgタグを配置すると、imgタグのsrcがリンク先となってしまう問題

問題

以下のように、aタグ内にimgタグを書くのはとても一般的かと思いますが、
Android端末でのWebViewでimgタグをタップした場合のみ、imgタグ内のsrcに飛んでしまう問題がありました。

        <ul class="categories">
            <li class="category">
                <a href="https://hogefuga.com/category1" target="_blank">
                    <img src="/img/category1.png" alt="" class="category-icon">
                    <p class="category-name">カテゴリー1</p>
                </a>
            </li>
            <li class="category">
                <a href="https://hogefuga.com/category2" target="_blank">
                    <img src="/img/category2.png" alt="" class="category-icon">
                    <p class="category-name">カテゴリー2</p>
                </a>
            </li>
        </ul>

解決策 (2020/11/05修正)

imgタグにpointer-events:none;を設定

とりあえずaタグ以下にimgタグを配置するのを止めて、aタグと同改装に配置し直す。
さらにpointer-events: none; を設定することをで解決した。
なぜ上記の様な問題が起こるのかは不明。謎です。

        <ul class="categories">
            <li class="category">
                <img src="/img/category1.png" alt="" class="category-icon" style="pointer-events: none;">
                <a href="https://hogefuga.com/category1" target="_blank">
                    <p class="category-name">カテゴリー1</p>
                </a>
            </li>
            <li class="category">
                <img src="/img/category2.png" alt="" class="category-icon" style="pointer-events: none;">
                <a href="https://hogefuga.com/category2" target="_blank">
                    <p class="category-name">カテゴリー2</p>
                </a>
            </li>
        </ul>

2020/11/05追記

解決策に誤りがありました...実際に行った修正と別の修正を書いてしまっていました。
結局aタグ内に配置した場合は前述の挙動となってしまうため、stylingでの解決になります。