Ярлыки в форме не отображаются

Вот код моего файла model.py:

class Review(models.Model):
    VOTE_TYPE = (
        ('up','Up Vote'),
        ('down','Down Vote'),
    )
    owner = models.ForeignKey(Profile, on_delete=models.CASCADE, null = True)
    project = models.ForeignKey(Project, on_delete=models.CASCADE) # when the model is deleted, all the reviews should also be deleted.
    body = models.TextField(null = True, blank=True)
    value = models.CharField(max_length=200, choices = VOTE_TYPE)
    created = models.DateTimeField(auto_now_add=True)
    id = models.UUIDField(default=uuid.uuid4, unique=True,
                           primary_key=True, editable=False)

Вот мой код forms.py:

class ReviewForm(ModelForm):
    class Meta:
        model = Review
        fields = ['value', 'body']

        labels = {
            'value': 'Place your vote',
            'body': 'Add a comment with your code'
        }

    def __init__(self,*args,**kwargs):
        super(ReviewForm, self).__init__(*args, **kwargs)

        for name,field in self.fields.items():
            field.widget.attrs.update({'class':'input'})

Это мой код html файла

<form class="form" action="{% url 'project' project.id %}" method="POST">
               {% for field in form %} 
               <!-- 'form' IS THE WORLD WE PUT IN CONTEXT DICT IN PROJECTS VIEW. -->
              <div class="form__field">
                <label for="formInput#textarea">{{ field.label }}</label> 
                {{ field }}
              </div>
              {% endfor %}
              <input class="btn btn--sub btn--lg" type="submit" value="Add Review" />
            </form>

CSS метки находится здесь:

 .comments {
  margin-top: 4rem;
  padding-top: 3rem;
  border-top: 2px solid var(--color-light);
}

.comments .form label { 
  position: absolute;
  margin: -9999px; 
}

.commentList {
  margin: 3rem 0;
}

.comment {
  display: flex;
  gap: 2rem;
}

проблема в том, что ярлыки не отображаются. Может ли кто-нибудь помочь мне, как исправить эту проблему? Картинка с проверкой может помочь.

Изображение, приложенное к этому вопросу, будет очень полезно.

enter image description here

похоже, что ваш CSS скрывает метки, располагая их абсолютно точно и перемещая за пределы экрана с помощью margin: -9999px

если вы хотите, чтобы надписи были видны, удалите или измените это правило

.comments .form label { 
  position: relative;  
  margin: 0; 
  display: block; 
  font-weight: bold; 
}

если изменение css не работает, проверьте элемент с помощью инструментов разработки браузера и проверьте, отображаются ли метки в html, если они существуют в dom, но скрыты, то проблема в css. Если они отсутствуют в html, то django, возможно, не отображает их должным образом

Вернуться на верх