Не удается переопределить интервал между границами в таблице стилей агента пользователя

По какой-то причине я не могу переопределить интервал между границами в таблице стилей User Agent в Chrome. На данный момент он установлен на 2px, но я хочу, чтобы это было 0px. Коллапс границы переопределяется просто отлично, а интервал границы - нет.

Я также попытался добавить -webkit-border-horizontal-spacing и -webkit-border-vertical-spacing

Но эти переопределения не работают так же хорошо.

Мой HTML документ

<!DOCTYPE html>
<html>
  <head><link href="inventorystyle.css" rel="stylesheet" type="text/css"></head>
  <table border="0" cellspacing="0" cellpadding="0">
      <tbody>
         <tr>
             <td><img src="iron-helmet.png"></td>
             <td><img src="gold-helmet.png"></td>
             <td><img src="diamond-helmet.png"></td>
         </tr>
      </tbody>
  </table>  
</html>

Мой инвентарь style.css

table {
    border-collapse: collapse;
    border-spacing: 0px;
    -webkit-border-horizontal-spacing: 0px;
    -webkit-border-vertical-spacing: 0px;
}

2 ответа

Это сводило меня с ума.

Попробуйте добавить CSS img {display:block;}

Это избавило меня от этого.

Это просто ошибка в том, как Chrome показывает правила CSS в Инструментах разработчика. border-spacing свойство работает так, как определено в Chrome.

В этом случае, если вы проверяете table элемент, border-spacing информация отображается правильно. Это только для внутренних элементов, таких как td где Инструменты разработчика показывают вводящую в заблуждение информацию. border-spacing по определению собственность к ним не относится, поэтому ее ценность для них все равно не имеет значения. И если вы нажмете "Computed", вы увидите, что вычисленные стили не содержат border-spacing вообще, даже в наследственных свойствах.

В примере значение border-spacing для table элемент также не оказывает никакого влияния, так как а) используется модель сжимающейся границы и б) разметка HTML содержит cellspacing="0" атрибут, который устанавливает border-spacing в 0, если вы явно не переопределите это в CSS.

Другие вопросы по тегам