0

I link css to html on vs-code. center-aliend doesn't work here. Is there anyone who knows what part is wrong? I want to set the text 'Hello Static!!' to the center of the browser.

<home.html>

{% load static %}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}">
    <title>Static Practice</title>
</head>
<body>
    <div>Hello Static!!</div>
</body>
</html>

<style.css>

body {
    text-align: center;
}

<static_ex / settings.py>



# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.1/howto/static-files/

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    BASE_DIR / 'static'
]

Browser output

kissu
  • 40,416
  • 14
  • 65
  • 133
gkr gb
  • 1
  • 1
  • 1
  • double check your file path for the css, make sure it's in static/css/style.css – mango orange Mar 03 '21 at 04:37
  • thanks for the comment! it's in static/css/style.css as you said... – gkr gb Mar 03 '21 at 04:47
  • ```os.path.join(BASE_DIR , 'static')``` replace your staticfiles_dirs with this. also try ```python manage.py collectstatic``` after that. change your html code ```
    Hello Static!!
    ``` to ```

    Hello Static!!

    ```. your css should be ```h1 { text-align: center}```     – mango orange Mar 03 '21 at 05:24
  • I applied all you mentioned, still doesn't work..thanks for your comment! – gkr gb Mar 03 '21 at 06:07
  • Does this answer your question? [django html template can't find static css and js files](https://stackoverflow.com/questions/66437690/django-html-template-cant-find-static-css-and-js-files) – Ivan Starostin Mar 03 '21 at 07:31

1 Answers1

1

It is because you named the directory as 'css'. Change it to another name

Sebastian Silva
  • 11
  • 1