For the past couple of hours, I've been grappling with a puzzling issue while attempting to override Bootstrap in Django.
Initially, without any custom CSS files, the outcome looked like this:
https://i.sstatic.net/GLndf.png
Subsequently, I crafted a custom CSS file: my_site/css/master.css
.index-jumbotron {
background-color: #006DB0;
}
#main-title {
text-align: center;
color: white;
}
This led to the following result: https://i.sstatic.net/Plfst.png
Things seemed to be going well.
However, whenever I make alterations to that same file (even by using !important and paying close attention to specificity), the output always remains the same as the image shown earlier.
Surprisingly, when I specify my template to reference another file my_site/css/master2.css or css/master.css, the result is as expected:
https://i.sstatic.net/vjlSX.png
This is quite perplexing. Any thoughts on this? Could the Django-Bootstrap3 package possibly be causing this? I installed it between using the two different versions of the custom CSS file.