html <a></a> в каждом блоке

[Nunf]

Привет. Опять я и с той же проблемой что и тут.
Но теперь я уже не пытаюсь засунуть <a></a> между ul и li, пытаюсь засунуть внутрь li и все содержимое взять в <a></a>
Вот код что я делаю:

<li class="news unselectable">
                                    <a href="newsFull.php?news-id='.$news['id'].'">
                                        <div class="image" style="background: url('.$news['image'].') no-repeat center center;background-size: cover;"></div>
                                        <div class="information">
                                            <h1>'.$news['title'].'</h1>
                                            <p>'.$news['short_description'].'</p>
                                            <div class="block-bottom">
                                                <div class="statistics">
                                                    <span class="views" data-tooltip="Количество просмотров" data-tooltip-location="top">
                                                        <i class="fas fa-eye"></i>
                                                        <span> '.$news['views'].'</span>
                                                    </span>
                                                    <span class="likes" data-tooltip="Нравится?" data-tooltip-location="top">
                                                        <i class="fas fa-heart" id="news-id-'.$news['id'].'"></i>
                                                        <span id="likes-count-news-id-'.$news['id'].'"> '.$news['likes'].'</span>
                                                    </span>
                                                </div>
                                                <a class="date" data-tooltip="Дата публикации" data-tooltip-location="top">'.$date.' <i class="fas fa-calendar"></i></a>
                                            </div>
                                        </div>
                                    </a>
                                </li>

А вот что получает в итоге:

<li class="news unselectable">
                                    <a href="newsFull.php?news-id=1">
                                        <div class="image" style="background: url(/images/slider/slide_1.jpg) no-repeat center center;background-size: cover;"></div>
                                        </a><div class="information"><a href="newsFull.php?news-id=1">
                                            <h1>Добавлен раздел новостей</h1>
                                            <p>Был добавлен раздел новостей. Тут Вы можете узнавать о всех событыях нашего проекта</p>
                                            </a><div class="block-bottom"><a href="newsFull.php?news-id=1">
                                                <div class="statistics">
                                                    <span class="views" data-tooltip="Количество просмотров" data-tooltip-location="top">
                                                        <i class="fas fa-eye" aria-hidden="true"></i>
                                                        <span> 87</span>
                                                    </span>
                                                    <span class="likes" data-tooltip="Нравится?" data-tooltip-location="top">
                                                        <i class="fas fa-heart" id="news-id-1" aria-hidden="true"></i>
                                                        <span id="likes-count-news-id-1"> 1</span>
                                                    </span>
                                                </div>
                                                </a><a class="date" data-tooltip="Дата публикации" data-tooltip-location="top">11.03.2019 <i class="fas fa-calendar" aria-hidden="true"></i></a>
                                            </div>
                                        </div>
                               
                                </li>

Чоу не так?)

 

[Sonyx]

потому что ссылка внутри ссылки не работает.

 

[Nunf]

Sonyx, Спасибо, работает.

Я не знаю как лучше:

1. Одна тема на один вопрос
2. Не флудить темами

поэтому напишу еще один вопрос сюда.
У меня есть этот же блок, который я обвел в ссылку(

Спойлер: Код

<li class="news unselectable">
                                    <a href="newsFull.php?news-id=1">
                                        <div class="image" style="background: url(/images/slider/slide_1.jpg) no-repeat center center;background-size: cover;"></div>
                                        <div class="information">
                                            <h1>Добавлен раздел новостей</h1>
                                            <p>Был добавлен раздел новостей. Тут Вы можете узнавать о всех событыях нашего проекта</p>
                                            <div class="block-bottom">
                                                <div class="statistics">
                                                    <span class="views" data-tooltip="Количество просмотров" data-tooltip-location="top">
                                                        <i class="fas fa-eye" aria-hidden="true"></i>
                                                        <span> 97</span>
                                                    </span>
                                                    <span class="likes" data-tooltip="Нравится?" data-tooltip-location="top">
                                                        <i class="fas fa-heart" id="news-id-1" aria-hidden="true"></i>
                                                        <span id="likes-count-news-id-1"> 1</span>
                                                    </span>
                                                </div>
                                                <div class="date" data-tooltip="Дата публикации" data-tooltip-location="top">11.03.2019 <i class="fas fa-calendar" aria-hidden="true"></i>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                </li>

) и теперь при нажатии на любой елемент в этом блоке будет работать переход по ссылке, как я могу сделать что бы при нажатии на елемент i.fas.fa-heart не работал переход по ссылке?
Моя едениственная и жалкая идея реализации, которая не увенчалась успехом:

<li class="news unselectable">
                                    <a href="newsFull.php?news-id=1">
                                        <div class="image" style="background: url(/images/slider/slide_1.jpg) no-repeat center center;background-size: cover;"></div>
                                        <div class="information">
                                            <h1>Добавлен раздел новостей</h1>
                                            <p>Был добавлен раздел новостей. Тут Вы можете узнавать о всех событыях нашего проекта</p>
                                            <div class="block-bottom">
                                                <div class="statistics">
                                                    <span class="views" data-tooltip="Количество просмотров" data-tooltip-location="top">
                                                        <i class="fas fa-eye" aria-hidden="true"></i>
                                                        <span> 97</span>
                                                    </span>
                                                    </a>
                                                    <span class="likes" data-tooltip="Нравится?" data-tooltip-location="top">
                                                        <i class="fas fa-heart" id="news-id-1" aria-hidden="true"></i>
                                                        <span id="likes-count-news-id-1"> 1</span>
                                                    </span>
                                                    <a href="newsFull.php?news-id=1">
                                                </div>
                                                <div class="date" data-tooltip="Дата публикации" data-tooltip-location="top">11.03.2019 <i class="fas fa-calendar" aria-hidden="true"></i>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                </li>

 

[Sonyx]

вынести из под тега ссылки, посадить на нужное место через position:absolute