Logo Luan Morina
Shtresa mbi shtresën tjetër
Elementi <div></div> si shtresë mbi një tjetër

Brenda elementit (<div></div>) (division) mund të futet përmbajtje në një faqe të uebit. Pa CSS tregohen këta përmbajtës pas njëri tjetrit sikur që janë shkruar në kodin HTML dhe nuk kanë asnjë efekt në mënyrën se si tregohen.

Me CSS kemi mundësi që këta përmbajtës ti vendosim si shtresa mbi njëra tjetrën, sikur në shembullin këtu, duke ia dhënë shtresës së parë pozitën relative dhe shtresës së dytë me tekst brenda saj pozitën absolute.

Demonstrim
Shqipëri, t'qofsha falë,
t'kam nënë e m'ke djalë.

CSS
.shtresa-01 {
position: relative;
background-image:url("images/sfondi.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height: 240px;
border-radius: 6px;
}
.shtresa-02 {
position: absolute;
background: rgba(226, 142, 82, 0.29);
color: #ffffff;
padding: 5px 20px;
right: 0;
bottom: 20px;
}
HTML
<div class="shtresa-01">
<div class="shtresa-02"> 
Shqipëri, t'qofsha falë,<br />
t'kam nënë e m'ke djalë.
</div> 
</div>