Is there any way to make a text transpose a div
, type entering from one side and leaving the other?
My idea would be something like these images. Where text starts from one side and traverses on the inside of div
. Is there any way I can do this with CSS, and can I change the text without having to tinker with the CSS code to adapt each time I change the text?
OBS:Youdonotneedtolookexactlylikethepictures,justtoillustratetheidea.
Codemodel:
* {
box-sizing: border-box;
}
.texto {
/* border: 1px solid blue; */
text-align: center;
padding: 10px 0 10px 0;
position: relative;
overflow: hidden;
margin: 0 auto;
width: 50%;
perspective: 120px;
}
.texto span {
display: inline-block;
font-size: 50px;
font-family: sans-serif;
border: 6px solid red;
}
<div class="texto">
<span>meu texto</span>
</div>