Ссылка на изображение на главной странице не кликабельна

Question

В левом верхнем углу моего сайта есть логотип, который ссылается на домашнюю страницу. Некоторые области изображения не кликабельны. Области, по которым можно щелкнуть, работают нормально. Похоже, что кликабельные / не кликабельные области распределяются случайным образом. Как сделать так, чтобы ссылка работала по всей области логотипа?

<header>
    <nav>
        <a id="nav-logo" href="index.html">
            <img src="img/logo-header.png" alt="logo" />
        </a>
    </nav>
</header>

#nav-logo,
nav img{
    display: inline-block;
    float: left;
    height: 65px;
    margin: 5px;
    cursor: pointer;
}

Answer 1

Скорее всего, это margin, который не кликабелен. Кроме того, вы используете те же настройки CSS для ссылки и изображения, что на самом деле не имеет смысла (оба плавающих и встроенных блока, оба имеют поле и т. Д.). Сделайте изображение display: block, определите ширину для контейнера, сделайте изображение шириной 100% и его высоту auto

Answer 2

Попробуйте это

#nav-logo { display: block; }