bootstrap ширина основной части карты расширена за пределы верхнего и нижнего колонтитула карты

Question

The header and footer of the card is a little less then the body. Showing a little white on both sides. How do I stretch the header and footer so that it fills to the sides?

Thank you.

code snippet:

 <% = link_to «Редактировать профиль пользователя», edit_user_path (@ user.id), style: 'color: #FFFFFF'%>   Статьи  <% @ user.articles.each_slice (3) do | article | %> <% article.each do | article | %> <% = link_to "", article_path (article.id), class: "stretch-link"%> автор: <% = article.user.username%>  <% = article.title%>  <% = truncate (article.description, length: 100)%>   

Создано <% = time_ago_in_words (article.created_at)%> a go, отредактировано <% = time_ago_in_words (article.updated_at)%> <% end%> < % конец%>

Answer 1

Вместо того, чтобы применять к одному и тому же DIV классы «card» и «col-4», например: 4 дюйма, как показано ниже, при этом верхний и нижний колонтитулы должны занимать всю ширину карточки:

<div class="row">
    <div class="col-4">
        <div class="card">
            <div class="card-header">
                Title 1
            </div>
            <div class="card-body">
                Body 1
            </div>
        </div>
    </div>

    <div class="col-4">
        <div class="card">
            <div class="card-header">
                Title 2
            </div>
            <div class="card-body">
                Body 2
            </div>
        </div>
    </div>
</div>