Display & Position in Bootstrap
From the Bootstrap 5 cheat sheet · Utilities · verified Jul 2026
Display & Position
Display and position utilities
html
<!-- Display -->
<div class="d-none">Hidden</div>
<div class="d-block">Block</div>
<div class="d-inline">Inline</div>
<div class="d-inline-block">Inline block</div>
<div class="d-flex">Flex</div>
<div class="d-grid">Grid</div>
<!-- Position -->
<div class="position-static">Static</div>
<div class="position-relative">Relative</div>
<div class="position-absolute">Absolute</div>
<div class="position-fixed">Fixed</div>
<div class="position-sticky">Sticky</div>💡 Use translate-middle with position utilities to center
⚡ d-none d-md-block pattern for responsive visibility
📌 z-* utilities only work with positioned elements
🔥 overflow-auto adds scrollbars only when needed