Я использую HTML-скрипты Django для перебора списка тегов из ManyToManyField для статьи. Получение информации работает, но фактический размер границ вокруг тегов оказывается неправильным. Коробки нереально большие. Заголовки также находятся не там, где мне хотелось бы, хотя это и приостановлено.
CSS представляет собой комбинацию пользовательского CSS и CSS Tailwind (да, я знаю, что это плохая практика, но я ленив).
HTML:
{% расширяет 'head.html' %} {% нагрузки статической %} {% блокирует контент %} Статьи
{% если статьи %} {% за статью в статьях %} {{article.article_title }} {% для тега в статье.article_tags.all %} {{tag}} {% конец для %} {% конец для %} {% конечный %} {% конечный блок %} CSS:
.posts { размер шрифта: 20 пикселей; дисплей: сетка; разрыв: 4рем; столбцы-шаблона сетки: повторение (3, minmax (0, 1fr)); отступ слева: 12rem; отступ справа: 12rem; } .posts div { соотношение сторон: 1; } .article_box { ширина: 3/12; граница: 2 пикселя, сплошная черная; отступ: 0,5рем; } .ярлык { граница: 2 пикселя, сплошная черная; радиус границы: 20%; отступ: 0,25рем; маржа: 0,15бэр; } .теги { дисплей: гибкий; гибкая основа: авто; гибкое направление: строка; максимальная ширина: 3/12; } Результат:

Я хочу, чтобы теги находились на линии под заголовком, а границы тегов, окружающих их, соответствовали размеру текста. Я хочу, чтобы теги располагались рядом друг с другом, если они не выходят за пределы поля статьи, и в этом случае они переходят на следующую строку. Я также хочу, чтобы все они были внизу поля статьи.