I've been using MaterializeCSS, and I'm having some trouble to centralize stuff, I have the following snippet, and tried a lot of stuff, but I can't figure it out a way to centralize it because it always left aligns it
How do I do it?
@import 'https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css';
<div class="row">
<div class="col s12 m5 profile-inner center-block">
<img class="circle responsive-img perfil-icon" src="http://ddragon.leagueoflegends.com/cdn/6.24.1/img/profileicon/600.png">
<br><span class="center-align"style="font-size: 2.5rem">TyG Yeux</span><br>
<span style="font-size: 1.5rem">Level 50</span>
</div>
Use center-align
instead of center-block
. center-block
is suitable to used for centering image itself. But, currently you want to center from Parent container, by such need to use center-align to align all child to center
@import 'https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css';
<div class="row">
<div class="col s12 m5 profile-inner center-align">
<img class="circle responsive-img perfil-icon" src="http://ddragon.leagueoflegends.com/cdn/6.24.1/img/profileicon/600.png">
<br><span class="center-align"style="font-size: 2.5rem">TyG Yeux</span><br>
<span style="font-size: 1.5rem">Level 50</span>
</div>