Django评论区非作者隐藏编辑删除按钮时布局错乱修复

布局错乱由模板HTML标签嵌套错误直接导致：

• 原模板评论循环中，评论项外层多层容器的闭合</div>标签，全部被写在「当前用户为评论作者」的权限判断块内部
• 非评论作者访问页面时，权限判断不成立，这些闭合标签不会渲染到页面，DOM结构出现大量未闭合标签，直接引发布局崩溃
• 附加问题：原代码中用户名的<a>标签未正确闭合，存在HTML语法错误

不需要修改views.py代码，仅调整product_detail.html中评论循环部分的标签位置即可：

1. 将所有评论容器的闭合标签移动到权限判断块外部，保证无论用户是否有操作权限，评论的基础布局DOM结构都完整渲染
2. 仅将编辑、删除两个操作按钮放在作者权限判断内部，非作者访问时仅隐藏按钮，不破坏整体布局
3. 补全未闭合的用户名标签

修正后的评论循环完整代码如下，直接替换原模板中{% for review in reviews %}到{% endfor %}之间的所有内容即可：

{% for review in reviews %}
<div class="container">
    <div class="card">
        <div class="card-body">
            <div class="row">
                <div class="col-md-2">
                    <img src="https://image.ibb.co/jw55Ex/def_face.jpg" class="img img-rounded img-fluid" alt="Profile picture"/>
                    <p class="text-secondary text-center">{{ review.created_at|date:"Y-m-d" }}</p>
                </div>
                <div class="col-md-10">
                    <p>
                        <a class="float-left" style="color:blue"><strong>{{ review.created_by }}</strong></a>
                        <span class="float-right"><i class="text-warning fa fa-star">{{ review.rating }}/5</i></span>
                    </p>
                    <div class="clearfix"></div>
                    <p>{{ review.content }}</p>
                    {% if user.is_authenticated and user.id == review.created_by.id %}
                    <p>
                        <a class="float-right btn btn-primary ml-2 text-white"> <i class="fa fa-edit"></i> Edit</a>
                        <a class="float-right btn text-white btn-danger"> <i class="fa fa-trash"></i> Delete</a>
                    </p>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>
{% endfor %}

修复后非评论作者访问时，仅不显示编辑、删除按钮，评论区布局和作者视角完全一致。

内容的提问来源于stack exchange，提问作者tobias