Таблица, сгенерированная из DataTable, не имеет стиля макета

Question

Я использую DataTables для отображения моих данных json на html-странице, это работает, однако таблица, которую я получаю, не имеет стиля. (см. изображение). Я попытался добавить CSS-стилизацию со значением ширины, равным 80%, 100% и т. Д. Но ничего не произошло.

Примечание. Нет ничего плохого в отображении данных json в таблицу данных. Я уже сделал это, за исключением того, что макет ужасен.

введите описание изображения здесь

Это CDN, который у меня есть в моем заголовочном файле:

<!--Ajax CDN -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!--script src="/js/jquery.min.js"></script-->

<!-- Font Awesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">

<!-- Data Tables -->
<script src="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap.min.css"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap.min.js"></script>

Я попытался удалить загрузчик datatables, но он все тот же.

Это HTML-код, в котором я отображаю свою таблицу:

<div>
        <table class="table table-bordered" id="subjects_table">
            <thead class="thead-dark">
            <tr>
                <th>Code</th>
                <th>Offer #</th>
                <th>Description</th>
                <th>Units</th>
            </tr>
            </thead>
        </table>
    </div>

Answer 1

РЕШЕНИЕ:

Спасибо за тех, кто нашел время и поделился своим мнением. Я понял, что сделал глупую ошибку. CDN, которые я использовал, вызвал ошибку. Я удалил все ранее использовавшиеся CDN DataTabes и заменил их на:

<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">
<script src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>

Answer 2

пожалуйста, добавьте этот CDN

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>

<script type="text/javascript" src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>

<script type="text/javascript" src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap.min.js"></script>