Vertikální zarovnání stránky o plovoucí šířce na střed
Vertikální vycentrování stránky na střed okna prohlížeče.
Zde si můžete prohlédnout výsledek.
Toto řešení publikoval Dušan Janovský. Bližší popis najdete v článku Vertical Centering in CSS.
CSS
#obalovy
{
height: 400px;
overflow: hidden;
position: relative;
}
#obalovy[id]
{
display: table;
position: static;
}
#prostredni
{
position: absolute;
top: 50%;
}
#prostredni[id]
{
display: table-cell;
vertical-align: middle;
position: static;
}
#vnitrni
{
position: relative;
top: -50%
}
#vnitrni[id]
{
position: static;
}
div.priklad
{
border: 1px solid blue;
background-color: #dddddd;
}
div.priklad1
{
background-color: red
}
XHTML
<html>
<body>
<div id=“obalovy“ class=“priklad“>
<div id=“prostredni“ class=“priklad1″>
<div id=“vnitrni“ class=“priklad“>
Tady bude obsah stránky…
</div>
</div>
</div>
</body>
</html>
Mohlo by vás také zajímat
-
Nové AI modely od Open AI a Google
22. května 2024 -
Proč investovat do nejvýkonnějších VPS s AMD EPYC procesory
14. června 2024 -
Vaše pošta může být špatně nastavena – svěřte ji profesionálům
13. července 2023 -
VMC rapidně zvýšil open rate e-mailových kampaní ZONERu
9. května 2025
Nejnovější
-
20 let Ubuntu: Cesta od revoluce k digitální každodennosti
30. května 2025 -
Google Chrome nyní mění kompromitovaná hesla – jak to funguje?
28. května 2025 -
Google spouští AI Přehledy ve vyhledávání v Česku
23. května 2025 -
