Card group – Card group without a header
From Bootstrap - Demo Wiki
Component | ||
---|---|---|
Name | Card group | |
Description | Card group without a header | |
Provider | Skin | |
Reference | getbootstrap.com - card groups | |
Styling | For all possible color styles and corresponding examples, see colors. |
Card group without a header
- Result
Card title
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
Card title
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
Card title
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
- Code
<div class="card-group">
<div class="card">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
</p>
<p class="card-text">
<small class="text-muted">[[Lorem ipsum|Lorem ipsum...]]</small>
</p>
</div>
</div>
<div class="card">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
</p>
<p class="card-text">
<small class="text-muted">[[Lorem ipsum|Lorem ipsum...]]</small>
</p>
</div>
</div>
<div class="card">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
</p>
<p class="card-text">
<small class="text-muted">[[Lorem ipsum|Lorem ipsum...]]</small>
</p>
</div>
</div>
</div>
If you add more than three cards you will need to hide the table of contents automatically generated by MediaWiki by also adding the behaviour switch
__NOTOC__
to the page.