Estou precisando fazer este tipo de efeito com css será que tem como ?
Não teria importância utilizar css3
nem nenhum tecnologia, este tipo de css
será usado em um aplicativo feito em ionic
, não sei se isto importaria algo.
Preciso a reprodução identica a este, contendo um ícone e um texto dentro.
Tentei utilizar border-radius
e rotate
porem ele rodou todo conteúdo da div
.
.triangle {
height: 50px;
width: 50px;
background-color: red;
border-radius: 5px;
transform: rotate(50deg);
}
<ion-row>
<ion-col col-4>
<div class="triangle">
<ion-icon name="md-book" class=""></ion-icon>
<span>Algum texto</span>
</div>
</ion-col>
</ion-row>
border-radius
etransform: rotate()
em umadiv
?rotate:(-50deg)
nospan
e com posicionamentoabsoluto
nospan
e relativo no.triangle
. E para ficar inclinado no angulo certo seriam45deg