JSFiddle - React, Tailwind, and code Playground
by tropillero
HTML
<div class="wrapper">
<flowPlayer>Player</flowPlayer>
<div class="nomeMusica">Musica</div>
</div>
CSS
html, body {
height: 100%;
min-height: 100%;
}
body {
font: 15px arial;
color: rgba(0, 0, 0, .7);
}
.wrapper {
height: 100%;
min-height: 100%;
/* habilita o flex nos filhos diretos */
display: -ms-flex;
display: -webkit-flex;
display: flex;
/* centraliza na vertical */
-ms-align-items: center;
-webkit-align-items: center;
align-items: center;
/* centraliza na horizontal */
-ms-justify-content: center;
-webkit-justify-content: center;
justify-content: center;
}
.wrapper div {
padding: 40px;
border: 0px solid rgba(0, 0, 0, .3);
}
.div flowPlayer {
background-color: green;
}