Почему появляется тонкая черная линия, когда я устанавливаю прозрачный фон панели навигации?

#html #css

#HTML #css

Вопрос:

Я пытаюсь сделать панель навигации прозрачной, но без видимой причины появляется тонкая черная линия. Вот как это выглядит: https://teampolair.com
Тонкая черная линия под параметрами меню

Мой CSS здесь:

 .topnav {
        background-color: transparent;
        overflow: hidden;
        margin-bottom: 0;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 100;
        font-size: 18px;
    }
    .topnav b {
        float: right;
        padding: 0px 1em;
    }
    .topnav b img {
        height: 2.8em;
        width: auto;
        padding-top: .56em;
    }
    .topnav a {
        color: #E0E0E0;
        text-align: center;
        float: left;
        padding: 0.78em 1em;
        text-decoration: none;
        font-size: 1em;
    }
    .topnav a:hover {
        background-color: #E0E0E0;
        color: #302F2F;
    }
    .topnav a.active {
        background-color: #454544;
    }
    .topnav.scrolled {
        background-color: #000000;
        transition: background-color 200ms linear;
    }
 

Я полагаю, что единственные части topnav, которые должны влиять на него, — это все, что связано с «a». Кто-нибудь может помочь мне с моей проблемой?

Комментарии:

1. Можете ли вы воспроизвести это в codepen или jsfiddle или что-то в этом роде или предоставить ссылку? Я не думаю, что здесь достаточно информации, чтобы помочь вам.

2. @Ted Да, я определенно могу это сделать.

3. Стиль для элемента a добавляет эту границу border-bottom: dotted 1px rgba(0, 0, 0, 0.25);

4. @GrzegorzT. Спасибо! Я использовал код шаблона, поэтому не обращал на это внимания.

Ответ №1:

a В строке 247 «main.css» есть правило CSS, которое содержит border-bottom: dotted 1px rgba(0, 0, 0, 0.25); . Если вы удалите это, проблема будет решена.

Комментарии:

1. А, понятно, я использовал код шаблона, поэтому не понял этого. Спасибо!