Cztery sposoby centrowania elementu w div.
Najpierw przygotujemy style dla html, mały reset nie jest zły 😉
* {
padding: 0;
margin: 0;
}
html,
body {
margin: 0;
padding: 0;
height: 100%;
}
body {
overflow: hidden;
}
padding: 0;
margin: 0;
}
html,
body {
margin: 0;
padding: 0;
height: 100%;
}
body {
overflow: hidden;
}
oraz html
<div class="wrapper">
<p></p>
</div>
<p></p>
</div>
A teraz konkrety:
I. Podstawowy i zawsze działający styl.
.wrapper {
display: block;
width: 100%;
height: 100%;
}
p {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: blue;
width: 100px;
height: 100px;
margin: auto;
}
display: block;
width: 100%;
height: 100%;
}
p {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: blue;
width: 100px;
height: 100px;
margin: auto;
}