Я использовал все свои запасные нейроны, пытаясь выяснить, почему эта CSS не работает на этом моем тестовом сайте - PullRequest
Новая
       1

Я использовал все свои запасные нейроны, пытаясь выяснить, почему эта CSS не работает на этом моем тестовом сайте

0 голосов
/ 29 мая 2020 

#faleConnosco a {
  letter-spacing: 0.3em;
  border-radius: 30px;
  color: #000;
  border: 1px solid rgba(0, 0, 0, 0.63);
  font-size: 1.3em;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 15px;
  padding-right: 15px;
  text-decoration: none;
  transition: all 0.9s ease-in-out;
}

#faleConnosco a:hover {
  background-color: #f00;
  color: #fff;
  padding-left: 35px;
  padding-right: 35px;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Page title</title>
  <link rel="stylesheet" href="myCSS.css">
</head>

<body>

  <table>
    <tbody>
      <tr>
        <td>
          <div id="faleConnosco"><a href="https://example.com">FALE CONNOSCO</a></div>
        </td>
      </tr>
    </tbody>
  </table>

</body>

</html>

это отлично работает. Вы наводите указатель мыши на слова, появляется красный овал, и текст становится белым

, но когда я добавляю этот код на этот сайт, я тестирую , это не так.

Наведите указатель мыши на FALA CONNOSCO ... он не станет красным.

Я использовал все свои запасные нейроны, пытаясь понять, почему. Даже курсор не превращается в указатель.

1 Ответ

2 голосов
/ 29 мая 2020

Есть блок div, «двадцать семнадцать панелей», с отрицательным полем, закрывающим кнопку. Это CSS должно исправить это. 

#post-98.twentyseventeen-panel {
margin-bottom: -30px;
}

Это было обнаружено с помощью инструмента разработки в Chrome браузере. Вы можете использовать его, наведя курсор на нужный элемент и щелкнув правой кнопкой мыши, чтобы выбрать «проверить». Затем откроется инструмент разработчика, в котором будет выделен и открыт элемент HTML. Здесь вы можете развернуть, открывая каждый элемент HTML внутри первого, пока не найдете кнопку. Выбрав каждый элемент, вы увидите CSS свойств. Больше всего выделялось отрицательное поле -100px на .twentyseventeen-panel, потому что обычно это может вызвать проблемы. Метод проб и ошибок помогает, переключая флажки свойств CSS, чтобы увидеть, как каждый из них влияет на HTML. Надеюсь, это поможет.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...