title: Conflicting Bootstrap and admin css in Django
body: <p>I'm using Bootstrap with Django, as well as css from the admin (for a date widget). My problem is that on the pages where I have the date widget, the admin css overrides the bootstrap css so the whole page looks different. How can I fix that?</p>
  
  <p>base.html</p>
  
  <pre><code>&lt;head&gt;
  
       {% block extra_head %}
       {% endblock %}
  
      &lt;link href="{{ STATIC_URL }}bootstrap/css/bootstrap.css" rel="stylesheet" media="screen"&gt;
  
      &lt;link href="{{ STATIC_URL }}bootstrap/css/bootstrap-responsive.css" rel="stylesheet"&gt;
  
  &lt;/head&gt;  
  </code></pre>
  
  <p>template with date widget</p>
  
  <pre><code>{% extends "base.html" %}
  {% load adminmedia %}
  
  {% block extra_head %}
  
    &lt;link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}admin/css/base.css"/&gt;
    &lt;link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}admin/css/widgets.css"/&gt;
  
    &lt;script type="text/javascript" src="/admin/jsi18n/"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="{{ STATIC_URL }}admin/js/core.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="{{ STATIC_URL }}admin/js/admin/RelatedObjectLookups.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="{{ STATIC_URL }}admin/js/jquery.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="{{ STATIC_URL }}admin/js/jquery.init.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="{{ STATIC_URL }}admin/js/actions.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="{{ STATIC_URL }}admin/js/calendar.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="{{ STATIC_URL }}admin/js/admin/DateTimeShortcuts.js"&gt;&lt;/script&gt;
  
    &lt;script type="text/javascript"&gt;window.__admin_media_prefix__ = "{% filter escapejs %}{% admin_media_prefix %}{% endfilter %}";&lt;/script&gt;
  
  {% endblock %}
  </code></pre>