2
Does anyone know why this happens? When I refresh the page a part of the following tabs appears and then disappears when it finishes loading. I want to prevent that from happening.
HTML
<section class="section-cadastro blue-grey darken-4 z-depth-5 row">
<div class="col s12">
<h4>Escolha o tipo de cadastro</h4>
<ul id="tabs-swipe-demo" class="tabs">
<li class="tab col s3"><a class="active" href="#test-swipe-1">Test 1</a></li>
<li class="tab col s3"><a class="indicator-custom" href="#test-swipe-2">Test 2</a></li>
<li class="tab col s3"><a class="indicator-custom" href="#test-swipe-3">Test 3</a></li>
<li class="tab col s3"><a class="indicator-custom" href="#test-swipe-4">Test 4</a></li>
<li class="tab col s3"><a class="indicator-custom" href="#test-swipe-5">Test 5</a></li>
</ul>
<div id="test-swipe-1" class="col s12 normal-user">
<form class="col s12">
<div class="row">
<div class="input-field col l6 m6 s12">
<input id="first_name" type="text" class="validate">
<label for="first_name">Primeiro Nome</label>
</div>
<div class="input-field col l6 m6 s12">
<input id="last_name" type="text" class="validate">
<label for="last_name">Segundo Nome</label>
</div>
</div>
<div class="row">
<div class="input-field col s6">
<input id="password" type="password" class="validate">
<label for="password">Senha</label>
</div>
<div class="input-field col s6">
<input id="confirm_password" type="password" class="validate">
<label for="confirm_password">Confirmar Senha</label>
</div>
</div>
<div class="row">
<div class="input-field col s4">
<input id="email" type="email" class="validate">
<label for="email">Email</label>
</div>
<div class="cad-select input-field col l4 m6 s12">
<select>
<option value="" disabled selected>Função </option>
<option value="1">Compositor</option>
<option value="2">Cantor</option>
<option value="3">Bateirista</option>
<option value="4"></option>
</select>
<label>Escolha sua Função</label>
</div>
<div class="cad-select input-field col l4 m6 s12">
<select>
<option value="" disabled selected>Instrumento </option>
<option value="1">Gaita</option>
<option value="2">Violino</option>
<option value="3">Violão</option>
<option value="4">Bateria</option>
<option value="5"></option>
</select>
<label>Escolha seu Instrumento</label>
</div>
</div>
<div class="cad-select input-field col s12 center">
<a class="blue btn btn-login">
Cadastrar-se
</a>
</div>
</form>
</div>
<div id="test-swipe-2" class="col s12 red">Test 2</div>
<div id="test-swipe-3" class="col s12 blue">Test 3</div>
<div id="test-swipe-4" class="col s12 green">Test 4</div>
<div id="test-swipe-5" class="col s12 grey">Test 5</div>
</div>
</section>
CSS
.section-cadastro .tabs-content.carousel .carousel-item{
height: 550px;
}
.section-cadastro{
padding: 0px 10px 30px 10px;
position: relative;
width: 100%;
}
.section-cadastro.row{
padding: 0 !important;
}
.section-cadastro > .col{
padding: 0 !important;
}
