Centrar horitzontal i verticalment en CSS

[vc_row][vc_column width=”1/2″][vc_column_text]A vegades pot fer falta centrar un element multimèdia al centre de la pantalla, i fer que aquest element es vegi sempre sencer en tots els dispositius. Per fer-ho, es pot utilitzar el fragment de codi adjunt.[/vc_column_text][/vc_column][vc_column width=”1/2″][vc_column_text]
<div class="container">
  <div class="vertical-center">
  </div>
</div>

<style>
.container { 
  height: 100vh;
  position: relative;
}

.vertical-center {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100vw;
}
</style>
[/vc_column_text][/vc_column][/vc_row]
Tags: No tags

Comments are closed.