как нарисовать все границы в DataTables?
 

Мой макет http://montaj.vianor-konakovo.ru/goods1.html и по какой то причине ячейки первого и последнего столбца не окрашиваются полностью в черный цвет. Кроме того мне не нравится сдвоенность границы между ячейками в заголовке.Как устранить эти недостатки?

А как ты делаешь?
Приведи стили для таблиц и ячеек.

Что бы не было сдвоенности
надо
border-collapse: collapse;
вместо
border-collapse: separate;

Кроме того в файле goods.css на 101 строке стоит
border-left: 1px solid #dddddd;

Вот она и серая.

внес изменения в goods.css в 35 и 102 строку согласно совета не помогло

Я смотрю ваш сайт с отладчиком хрома.
В отладчике у меня кеш отключен.
Смотрю файл goods.css

Строки 31-42

table.dataTable {
  width: 100%;
  margin: 0 auto;
  clear: both;
  border-collapse: separate;
  border-spacing: 0;
  /*
   * Header and footer styles
   */
  /*
   * Body styles
   */ }

Строки 100-102

table.dataTable.cell-border tbody tr th:first-child,
  table.dataTable.cell-border tbody tr td:first-child {
    border-left: 1px solid #dddddd; }

И где вы там, что изменили?

Пока писал, потом еще пару раз перезагрузил, файл css изменился, и толстые границы в заголовке пропали.
Все вертикальные границы в основной таблице стали серенькими.

точнее сдвоенность границы в заголовке исчезла а вот большинство границ стали серыми хотя менял только 35 строку
border-collapse: collapse;

посмотрите еще пожалуйста только перенес на сервер.строка 35 и ище изменение результата- пропали черные границы

и граница footer и body таблицы сдвоенная убрать сдвоенность?

Да. у tfoot верхняя граница толстая.
И шрифт там больше, чем у thead.
Еще надо у последних ячеек правую границы сделать черной.

Обычно еще у тыкательных элементов ставят
cursor: pointer;
Это я про картинки + и -

почти все получилось за исключением футера помогите побороть сей косяк

Вообще структура странная.
Я не пойму, зачем три таблицы?
Почему нельзя все было запихнуть в одну в thead, tbody, tfoot?
Ну да ладно, вам виднее. Может так и надо.

У ячеек, которые в теле, верхняя граница убрана. а нижняя есть
А у ячеек, которые в tfoot есть верхняя граница. Вот нижние из tbody и верхние из tfoot и накладываются.

Трудно быстро проанализировать
там много раз встречается border-top: none;
(строки 90 95 102 104)
Куда то туда надо еще добавить селектор для tfoot типа
table.dataTable.row-border tfoot tr:first-child th

прошу об всем этом поподробнее надо причесать страницу довести до кондиции

Честное слово, очень трудно разбираться.
У вас есть два файла good.css и datatables_for_cks.css
И там многое дублируется и переопределяется.
Например в одном

table.dataTable {
...
  border-collapse: separate;
...
}

В другом все тоже самое, но
border-collapse: collapse;

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

Я не понимаю, зачем 3 таблицы, одна с thead, одна с tbody, и еще одна с tfoot?
Почему нельзя сделать одну с thead, tbody и tfoot?
Во-первых 3 труднее стилизовать.
border-collapse: collapse;
действует только внутри одной своей таблицы. Он не будет убирать границы между таблицами.
И если уж вы думаете о доступности (атрибуты role, aria...)? то th ,будет заголовком только для своей таблице - на другую он распространяться не будет.

Мне кажется, что там надо навести порядок в css.
Ну а так надо просмотреть все определения
table.dataTable tfoot th {
}
и убрать везде верхнюю границу

Еще. в datatables_for_cks.css (191 стр)

table.dataTable.compact thead th,
table.dataTable.compact thead td,tfoot{
  padding: 0px 0px 0px 0px;font-size:10px; text-align:center;
}

Вроде определяется размер шрифта и для thead и для tfoot
Но в good.css (44 стр) переопределяется

table.dataTable thead th,
  table.dataTable tfoot th {
border: 1px solid #111111;
    font-weight: bold;
	border-spacing: 0;
    font-size:14px;	}

бьюсь и никак не пойму почему заголовок в thead не и устанавливается посредине

Потому, что

table.dataTable.compact thead th, 
table.dataTable.compact thead td {
    padding: 0px 17px 4px 0px;
}

good.css (167)

благодарю за ценные подсказки помогите побороть увеличенный шрифт в
footer и сдвоенность границы между footer и body таблицы

скорректировав строку 60 в goods.css сдвоенность границы удалось устранить а вот со шрифтами беда не могу найти место где ими можно управлять ни в заголовке ни в теле таблицы. Подскажите где искать

или подскажите как переопределить правило чтобы управлялись шрифты.
Не пойму какой нужен селектор

Ну отладчиком надо же пользоваться.
В отладчике можно посмотреть любой элемент. Какие классы к нему применяются, из каких файлов берутся и в каких строках описаны

good.css : 44

table.dataTable thead th,
table.dataTable tfoot th {
    border: 1px solid #111111;
    font-weight: bold;
    border-spacing: 0;
    font-size: 14px;
}

Про границы сказать трудно.
Они у вас определяются много раз и в разных файлах.
Например границы для tfoot>th определены в good.css в строках 44 и 53
в datatables_for_cks.css : 45
В центральной таблице зачем то тоже определен точно такой же tfoot, но с height:0px;
Короче, черт ногу сломит.
Наводите порядок в верстке. и в css
Иначе малейшее изменение, правка, и опять не поймешь, что откуда будет браться.

благодарю за ценнейшую результативную помощь. теперь разобравшись немного с отладчиком хрома сам вижу где прописаны примененные правила и понимаю почему именно так выглядит тот или иной элемент на страничке.все приходит с опытом.

если вас не затруднит подскажите где стоит поставить
cursor: pointer;
Это я про картинки + и -?

В центральной таблице зачем то тоже определен точно такой же tfoot, но с height:0px;
о какой таблице идет речь?

Более менее стилизовал таблицу.Осталась нерешенной одна задача это чтобы выделялся размером шрифта заголовок колонки по которой идет сортировка. Может кто подскажет как это сделать?

Я бы добавил в CSS

div.dataTables_scrollBody td.position,
div.dataTables_scrollBody td.position_reduce{
	cursor:pointer
}

В div.dataTables_scrollBody есть таблица

<table id="goods" class="display compact cell-border dataTable"...

В этой таблице, как я понимаю, у Вас лежат значения основных ячеек.
Но там же есть и

<thead>
            <tr role="row" style="height: 0px;">
...

с заполненным заголовком, который дублирует
thead из table из

<div class="dataTables_scrollHeadInner" style="box-sizing: content-box; width: 989px; padding-right: 0px;">
<table class="display compact cell-border dataTable" cellpadding="3px" width="100%" aria-describedby="goods_info" role="grid" style="margin-left: 0px; width: 989px;">
<thead>
            <tr role="row"> 
....