mirror of
https://github.com/twbs/bootstrap.git
synced 2024-12-12 00:08:59 +01:00
30 lines
830 B
Markdown
30 lines
830 B
Markdown
---
|
|
layout: docs
|
|
title: Display property
|
|
group: utilities
|
|
---
|
|
|
|
Use `.d-block`, `.d-inline`, or `.d-inline-block` to simply set an element's [`display` property](https://developer.mozilla.org/en-US/docs/Web/CSS/display) to `block`, `inline`, or `inline-block` (respectively).
|
|
|
|
To make an element `display: none`, use our [responsive utilities]({{ site.baseurl }}/layout/responsive-utilities/) instead.
|
|
|
|
{% example html %}
|
|
<div class="d-inline bg-success">Inline</div>
|
|
<div class="d-inline bg-success">Inline</div>
|
|
{% endexample %}
|
|
|
|
{% example html %}
|
|
<span class="d-block bg-primary">Block</span>
|
|
{% endexample %}
|
|
|
|
{% example html %}
|
|
<div class="d-inline-block bg-warning">
|
|
<h3>inline-block</h3>
|
|
Boot that strap!
|
|
</div>
|
|
<div class="d-inline-block bg-warning">
|
|
<h3>inline-block</h3>
|
|
Strap that boot!
|
|
</div>
|
|
{% endexample %}
|