Currently using Django with bootstrap 4. For whatever reason, I cannot get the font-family to change through my main.css file. I can change other attributes, but font does not seem to work.
If I change the font-family in my other files, it works. I just cannot change it through my main.css.
What am I doing wrong?
index.html
{% load static %}
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="{% static 'css/main.css' %}">
...
main.css
body {
font-family: "Times New Roman", Georgia, serif !important;
}
>Solution :
You either have 2 options, create a style tag in the head tag or select everything instead of body in main.css. Example:
base.html
{% load static %}
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="{% static 'css/main.css' %}">
<style>
* {
font-family: "Times New Roman", Georgia, serif !important;
}
</style>
...
or
main.css
* {
font-family: "Times New Roman", Georgia, serif !important;
}