Skip to main content

Position & Overflow

Les classes de débordement vous permettent de contrôler le comportement d'overflow d'un élément.

Overflow

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce cursus justo vitae commodo facilisis.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce cursus justo vitae commodo facilisis.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce cursus justo vitae commodo facilisis.

HTML
  <div class="overflow-hidden">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce cursus justo vitae commodo facilisis. </p>
</div>
<div class="overflow-x">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce cursus justo vitae commodo facilisis. </p>
</div>
<div class="overflow-y">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce cursus justo vitae commodo facilisis. </p>
</div>

Détails des classes

.oh, .overflow-hidden {
overflow: hidden;
}
.overflow-x {
overflow-x: auto;
}
.overflow-y {
overflow-y: auto;
}

Positionnement

Les classes de positionnement vous permettent de contrôler la position d'un élément sur la page.

Classes de positionnement

Element avec position relative

Elément avec position absolute

Elément avec position initial

HTML
  <div class="position-relative">
<p>Element avec position relative</p>
</div>
<div class="position-absolute">
<p>Elément avec position absolute</p>
</div>
<div class="position-initial">
<p>Elément avec position initial</p>
</div>

Détails des classes

.relative, .position-relative {
position: relative;
}
.absolute, .position-absolute {
position: absolute;
}
.position-initial {
position: initial;
}