Question

在Django项目中，我有一个未在正确位置渲染的边栏。在这种情况下，侧栏位于底部，而不是像其他内容相似的页面那样位于内容的右侧。我不知道如何移动它，并且已经尝试了base.html中的各种操作以及Django模板语言块内容的移动。

呈现模板（register.html）如下：

但是，按照教程的说明，它应该看起来像这样：

base.html的相关部分

<!--this is django templating language-->
<link rel="stylesheet" href="{% static 'worldguestbook\main2.css' %}"/>

</head>
<body>

<header class="site-header">
  <nav class="navbar navbar-expand-md navbar-dark bg-steel fixed-top">
    <div class="container">
      <a class="navbar-brand mr-4" href="/">FakeBook Newsfeed</a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarToggle" aria-controls="navbarToggle" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarToggle">
        <div class="navbar-nav mr-auto">
          <a class="nav-item nav-link" href="{% url 'socialmedia-home' %}">Home</a>
          <a class="nav-item nav-link" href="{% url 'socialmedia-about' %}">About</a>
        </div>
        <!-- Navbar Right Side -->
        <div class="navbar-nav">
          <a class="nav-item nav-link" href="{% url 'socialmedia-login' %}">Login</a>
          <a class="nav-item nav-link" href="#">Register</a>
        </div>
      </div>
    </div>
  </nav>
</header>

register.html

{% extends "socialmedia/base.html" %}
{% block content %}

    <div class="content-section">
    <form method="POST">
    {% csrf_token %}
    <fieldset class="form-group">
        <legend class="border-bottom mb-4">Hello: Register today!</legend>
        {{form.as_p}}
    </fieldset>
    <div class="form-group">
        <button class="btn btn-outline-info" type="submit">Register</button>
    </form>
    <div class="border-top pt-3">
        <small class="text-muted">Signed up already? <a class="ml-2" href="#">Login</a> here</small>
    </div>
{% endblock content %}

views.py

#USERS (register) view.py

from django.shortcuts import render
from django.contrib.auth.forms import UserCreationForm
# Create your views here.

def register(request):
    form = UserCreationForm()
    return render(request, 'users/register.html',{'form':form})

请注意，base2.html中引用了main2.css样式表，该样式表在除该页面之外的所有其他页面上均能正常工作。在其他页面中，侧栏会正确显示在页面的右侧。

Answer 1

问题是缺少一个div，使我完全没有引起注意。

register.html页面可以如下重写。注意div，其中之一不见了。我还整理了缩进，这很有帮助。

{% extends "socialmedia/base.html" %}
{% block content %}
    <div class="content-section">
        <form method="POST">
        {% csrf_token %}
        <fieldset class="form-group">
            <legend class="border-bottom mb-4">Hello: Register today!</legend>
            {{form.as_p}}
        </fieldset>
    <div class="form-group">
        <button class="btn btn-outline-info" type="submit">Register</button>
    </div>
    </form>
    <div class="border-top pt-3">
        <small class="text-muted">
            Signed up already? <a class="ml-2" href="#">Login</a>
            </small>
        </div>
    </div>
{% endblock content %}

Django模板侧边栏未按应有的方式呈现

1 个答案: