Порядок специфики классов CSS

Я определил свой собственный класс CSS:

.my-ui-table td {
border-width: 1px;
border: 0;
padding: 5px 10px;
border-style: hidden;
border-color: inherit;
}

PrimeFaces css по умолчанию определяет свой собственный класс, который применяется к:

.ui-panelgrid td {
border-width: 1px;
border-style: solid;
border-color: inherit;
padding: 4px 10px;
}

Оба класса применяются к таблице:

<table class="ui-panelgrid ui-widget my-ui-table" role="grid">...</table>

Когда Chrome отображает указанную таблицу, стиль границы из класса ui-panelgrid имеет приоритет над стилем границы, определенным в классе my-ui-table. Я читал о специфике CSS, и похоже, что специфичность одинакова для обоих определений классов, поэтому тот, который указан последним в атрибуте class = "", должен победить. Почему этого не происходит?

РЕДАКТИРОВАТЬ: HTML заголовок тега:

<head>
 <link type="text/css" rel="stylesheet" href="/webapp/do/javax.faces.resource/my.css?ln=css">
 <link type="text/css" rel="stylesheet" href="/webapp/do/javax.faces.resource/primefaces.css?ln=primefaces">
</head>

.

Ответы на вопрос(1)

Ваш ответ на вопрос