src/scss/bootstrap-4.0.0-alpha.6/docs/utilities/display-property.md

   1 ---
   2 layout: docs
   3 title: Display property
   4 group: utilities
   5 ---
   6
   7 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).
   8
   9 To make an element `display: none`, use our [responsive utilities]({{ site.baseurl }}/layout/responsive-utilities/) instead.
  10
  11 {% example html %}
  12 <div class="d-inline bg-success">Inline</div>
  13 <div class="d-inline bg-success">Inline</div>
  14 {% endexample %}
  15
  16 {% example html %}
  17 <span class="d-block bg-primary">Block</span>
  18 {% endexample %}
  19
  20 {% example html %}
  21 <div class="d-inline-block bg-warning">
  22   <h3>inline-block</h3>
  23   Boot that strap!
  24 </div>
  25 <div class="d-inline-block bg-warning">
  26   <h3>inline-block</h3>
  27   Strap that boot!
  28 </div>
  29 {% endexample %}