Django does not support CSS styling out of the box

My webpage is rendering HTML correctly, but the CSS styles are not being applied. I am currently in development mode and running the django dev runserver.

 STATICFILES_DIRS = ("C:/Users/user/site/sitemain/static",)
 STATIC_ROOT= '' STATIC_URL = '/static/'
 MEDIA_ROOT= '' MEDIA_URL=''

The CSS link in my HTML file is:

<link rel="stylesheet" type="text/css href="{{ STATIC_URL}}/base.css" />
. The template file is base.html. I'm stumped as to why my CSS is not showing up!

Answer №1

It is important to always include a closing quotation mark when using attributes in HTML, such as <code>type="text/css"

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Ensuring the width of a div matches the adjacent containers

I need assistance in creating a form that adjusts its width based on the form fields. The form contains both explanatory text and input fields, each enclosed in a div with inline-block set. The outer div (also using inline-block) should not expand beyond ...

php - Can you identify the issue?

File Name: sms1.php Located at: Here is the PHP code for sms1.php: <?php //Variables to POST $user = "hidden"; $password = "hidden"; $mobiles = "$_POST[phone]"; $message = "$_POST[msg]"; $sender = "$_POST[sender]"; //Setting up CURL to send data via ...

Tips for creating a dynamic variable for an object key in jQuery to streamline your code

Utilizing the TweenMax library, I am adding styles to a div while scrolling. However, I am facing a challenge where I need different styles based on varying page resolutions. To address this issue, I implemented an if condition. Is there a way I can use a ...

Display issue with loading animation

After clicking the button and seeing the alert message, I noticed that the loading animation does not display during the await new Promise(r => setTimeout(r, 2000));. /* script.js */ async function refreshStatus() { document.getElementById("load ...

Obtaining HTML content using Java

I received my personal data download from Facebook and decided to have some fun with it. I'm currently trying to isolate a specific group chat that I am a part of. The file size I am working with is 18 kB, filled with HTML code within tags but lackin ...

Adjust the height of the Twitter Widget to be proportionate to the height of its parent div dynamically

I have integrated the Twitter widget into my library management system, but I am facing an issue with its fixed height. Is there a way to make the height dynamic through CSS? Any suggestions on how this can be achieved will be greatly appreciated. Below ...

Fixed position of the element within a parent stacking context

How can I ensure that the #icon appears below the #dropdown in the following example? https://i.stack.imgur.com/GoBcR.png The position: fixed of #container seems to be creating a new stacking context for its children. Changing the position value fixes th ...

Using two forms in Django's form_valid function

Can anyone provide guidance on how to incorporate two forms in the same view within a restricted channel using Django? One form is for chatting, while the other triggers a conversation (with a boolean field defaulting to false). Both forms should direct to ...

Overflow due to cascading style sheets

THE ANSWER TO THIS QUESTION HAS BEEN PROVIDED In regards to this particular div that contains two unordered lists, I am seeking a solution where these lists can be positioned side by side instead of above or below each other. I have attempted various met ...

An error with rendering in Internet Explorer 8

When I hide a td in a table by setting its display to none, the table does not resize correctly when using IE8. If I have a table and want to remove an entire column, I might try something like this: $("th:first, th:last, tr td:first-child, tr td:last-ch ...

Start up JQuery User Interface

I've been having some trouble with Jquery UI and it's been quite frustrating. To try to understand better, I have created a simple test case which you can view here: http://jsfiddle.net/vmZap/ Essentially, I have included JQUERY, JQUERY-UI, and ...

Exploring the differences between pseudo-elements when styled as display:block versus display:inline

I'm currently honing my CSS skills by following a Youtube tutorial from freecodecamp.org Here's the code I've been working on: p::before{ content: "hello "; color: white; font-size: 60px; background: salmon; margin-bottom: 20px ...

Creating a CSS triangle that smoothly transitions between two different colors

Is it possible to create a triangle in CSS that smoothly transitions between two colors without relying on a hover state? .arrow-down { width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; b ...

Why isn't Google Map showing up in my HTML <div> section?

I am currently working on a web page that consists of two containers. The mainmapdiv container covers the entire page, while the mainhomediv container is positioned on top of the mainmapdiv. My goal is to hide the mainhomediv container and show a Google Ma ...

What sets Django apart from Django Rest Framework?

My knowledge of Django extends to understanding that it is a tool used for developing web applications. The confusing part for me lies in Django Rest Framework (DRF). According to Google, DRF is meant for creating APIs, but the purpose eludes me. If Djan ...

Images and CSS are functioning properly when viewed locally, but are not displaying as expected on GitHub pages

There seems to be some issues with transferring my website from a custom domain on Hover. When I try to import it to anthematics.github.io, only the HTML loads while images and CSS are missing. <link rel="stylesheet" href="theme.css" type="text/css"> ...

The mouseover and mouseleave functions remain active even during window resizing

I wish to create a dynamic menu that appears when hovering over a user, but only if the window size is above 977 pixels. Take a look at my code below: $(document).ready(function() { $(window).on("load resize", function(event){ var windowS ...

creating a div that functions similarly to a radio button

Is it possible to create a div that mimics the behavior of a radio button? I'm looking for a solution that doesn't involve jquery, as many people have recommended. After doing some research, I found a few potential options. In the past, I'v ...

After all other content has been fully loaded, jQuery UI is then loaded onto

For a while now, I've been following a YouTuber's JQuery UI tutorial. Every time I refresh the page, my HTML loads first and then my CSS fills in, causing a momentary flash of HTML and CSS without the UI. Is this normal? Can it be prevented? Her ...

The Card Component from Core UI fails to appear in the Print Preview feature

I'm currently experimenting with the Card Component from the Core UI framework. However, I'm facing an issue where the color of the Card component and its associated icon do not appear in the Preview when trying to print the page. I attempted to ...