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

Включение встроенных стилей работает, но я не уверен, читает ли он файл 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.

0
Helana Brock 15 Апр 2019 в 20:51

2 ответа

Лучший ответ

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

1
Triston Wasik 15 Апр 2019 в 18:21

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

0
Nosnetrom 15 Апр 2019 в 18:19