Не уверен, использует ли HTML файл CSS, потому что изменения, внесенные в файл CSS, не отображаются на веб-странице. Что мне делать?

#html #css

#HTML #css

Вопрос:

Мне поручено создать предупреждение в отчетах «Бета: пустые простыни» и «Бета: список залов с пустыми кроватями». Я должен поместить предупреждение в верхней части страницы. Я хочу, чтобы он был центрирован и не занимал всю ширину страницы.

Ввод встроенных стилей работает, но я не уверен, читает ли он файл CSS. Учитывая, что это для работы, я не могу перемещать сам файл, и я на 99% уверен, что он находится в хорошем расположении файла, поскольку он уже есть у моих коллег / босса.

HTML-код:

 {% extends 'reports_templates/base.html' %}
{% load static from staticfiles %}

{% block extra-head %}
<link rel="stylesheet" type="text/css" href="{% static 'datatables/media/css/jquery.dataTables.min.css' %}">
<link rel='stylesheet' type='text/css' href="{% static 'css/empty_bedspaces.css' %}">
{% endblock %}

{% block title %}
<title>Empty Bed Spaces</title>
{% endblock %}

{% block content %}
<div class="alert alert-danger" id="alert">
  <strong>Note:</strong> Some of the rooms below may not be available for assignment.
</div>
  

Код CSS:

 .container div {
  margin: 1%;
}

#specific-table tr th {
  border-bottom: 1px solid #111;
}

th.title {
  text-align: center !important;
}

.alert-danger {
    font-size: 72px;
}
  

Если я сделаю:

 <div class="alert alert-danger" style="margin: 45%" >
  <strong>Note:</strong> Some of the rooms below may not be available for assignment.
</div>
  

Это заставляет его занимать достаточное количество места на странице. Кроме того, имейте в виду, что это далеко не весь код. Я не хотел вставлять огромный файл.

Вот изображение того, как это выглядит до сих пор, только с предупреждением div.

Комментарии:

1. Попробуйте очистить кеш, а затем перезагрузите страницу и посмотрите, вступит ли это в силу

2. Щелкните правой кнопкой мыши «проверить страницу» в вашем браузере и посмотрите в разделе «сеть», загружен ли файл css.

3. @nologin похоже, что это там

4. @GrumpyCrouton idk как именно это сделать

5. @HelanaBrock Поиск в Google «[вставить браузер здесь] очистить кэш»

Ответ №1:

Попробуйте очистить кеш в большинстве браузеров: CTRL SHIFT R. Во время разработки я бы также рекомендовал отключить локальное кэширование на вашей панели разработки. В Chrome это будет F12> Вкладка Сеть> Флажок Отключить кэш. Возможно, вам также потребуется перезапустить браузер, чтобы принудительно внести изменения.

Ответ №2:

Если вы используете Bootstrap, вы могли бы предоставить его class="col-md-8 col-md-push-2 text-center".