Почему ширина столбца нарушена?

Question

У меня есть таблица с разметкой сетки. Но когда ширина уменьшается, не все столбцы имеют одинаковую ширину. Здесь Кількість охватывает два столбца 2fr. Поэтому я ожидаю, что он имеет такую ​​же ширину, что и два столбца: 1 и грн. Исходный код

/* The layout for invoice items */
.items-grid {
  width: 680px;
	display: grid;
	grid-template-columns: 2fr 4fr 60% 2fr 2fr 3fr 3fr;
	grid-template-rows: auto;
	border: 3px solid black;
}

/* All cells should be aligned vertically by center */
.items-grid > dt {
	display: grid;
	align-items: center;
}

/* Do not display right/bottom border for last column/row */
.items-grid > dt:not(:nth-child(7n)) {
	border-right: 2px solid black;
}
.items-grid > dt:not(:nth-last-child(-n+7)) {
	border-bottom: 2px solid black;
}


/* N, Code */
.items-grid > dt:nth-child(7n +1),
.items-grid > dt:nth-child(7n +2)
{
	justify-items: center;
}

/* Qty, Price, Suma */
.items-grid > dt:nth-child(7n +4),
.items-grid > dt:nth-child(7n +6),
.items-grid > dt:nth-child(7n +7)
{
	justify-items: end;
}


/** STYLING FIRST LINE **/
.items-grid > dt:nth-child(-n+7) {
	font-weight: bold;
	justify-items: center;
	text-align: center;
}

/* 'Quantity' column is splitted by two later */
.items-grid > dt:nth-child(4) {
	grid-column-start: span 2;
}

/* added for parity cell should be hidded */
.items-grid > dt:nth-child(5) {
	display: none;
}

<dl class="items-grid">
  <dt>№
  <dt>Код
  <dt>Товари (роботи, послуги)
  <dt>Кіль<wbr>кість
  <dt>
  <dt>Ціна з ПДВ
  <dt>Сума з ПДВ
  <dt>1
  <dt>MED000754
  <dt>Надання в строкове платне користування Віртуальної інфраструктури (TuchaBit)
  <dt>1
  <dt>грн
  <dt>630,62
  <dt>630,62
  <dt>2
  <dt>MED000754
  <dt>Надання в строкове платне користування Віртуальної інфраструктури (TuchaBit)
  <dt>1
  <dt>грн
  <dt>630,62
  <dt>630,62
</dl>

UPD
Это сломано только в FF