CODEWITHSUNDEEP
htmlcss
Helana Brock
Helana Brock

Reputation: 55

Not sure if HTML is using CSS file because changes made to CSS file do not show up on webpage. What do I do?

I am tasked with making an alert on the "Beta: Empty Bedspaces" and "Beta: Hall Roster With Empty Beds" reports. I have to put the alert in at the top of the page. I want it to be centered and not take up the whole width of the page.

Putting in inline styles work, but I am not sure if it is reading the CSS file. Considering this is for a job, I can't really move the file itself around, and I am 99% sure it's in a good file location as that's where my coworkers/boss already has it.

HTML code:

{% 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 code: 

.container div {
  margin: 1%;
}

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

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

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

If I do: 

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

It makes it take up an adequate amount of page space. Also, keep in mind this is not nearly all the code. I didn't want to paste a huge file.

Here is a picture of how it looks so far with just the alert div.

Upvotes: 0

Views: 56

Answers (2)

Triston Wasik
Triston Wasik

Reputation: 56

Try clearing your cache, most browsers: CTRL+SHIFT+R. While developing, I would also recommend disabling caching locally in your development panel. In Chrome it will be F12 > Network Tab > Check Disable Cache. You may need to restart your browser to force the changes as well.

Upvotes: 1

Nosnetrom
Nosnetrom

Reputation: 161

If you are using Bootstrap, you could give it class="col-md-8 col-md-push-2 text-center".

Upvotes: 0

Related Questions