Bootstrap5 Stretched-link 不适用于简单的卡片

Question

我有一个小问题，stretched-link 不想使用我的卡，我尝试了 Bootstrap 文档中的所有方法。还尝试删除按钮，因为我读到它们在拉伸-link 下“生活得不好”。我使用 django-bootstrap-v5（顺便说一句，用这个好吗？）

这是我的代码：

       <div class="card mb-3" style="width: 81rem;">
            <div class="row g-0">
                <div class="col-md-4">
                    <a type="button" class="streched-link" href="{% url 'bloger:post' post.id %}">
                        <img class="img-fluid" src="...">
                    </a>
                </div>
                <div class="col-md-8" style="max-height: 11rem;">
                    <div class="card-header d-flex bd-highlight">
                        <small class="text-muted p-1 flex-grow-1">Added {{ post.date_added|timesince:currentdate}} ago.</small>
                        <small class="text-muted p-1 flex-grow-3">Komentarze: {{ post.blogcomment_set.count }}</small>
                    </div>
                    <div class="card-body" style="max-height: 10rem;">
                        <h4 class="card-title">{{post.title|title}}</h4>
                        <p class="card-text" style="max-height: 8.4rem;"><i>{{post.truncated_text}}</i></p>
                        <a class="streched-link btn btn-danger" href="{% url 'bloger:post' post.id %}">Read more</a>
                    </div>
                </div>
            </div>
        </div>

Answer 1

你拼错了 stretched

Bootstrap5 Stretched-link 不适用于简单的卡片

Bootstrap5 Stretched-link doesn't work with a simple card

html

django

bootstrap-4

bootstrap-5