Text over div with borders

Asked

Viewed 405 times

2

Speak guys! I have a div . presentation, in it I applied edges to become a triangle. Beauty, but I want to put a text above, but with the modified edges of . presentation, it is not aligned. How can I improve my code? Personal thank you! :)

CODE:

.apresentacao {
  width: 0px;
  height: 0px;
  border-right: 100px solid transparent;
  border-top: 100px solid transparent;
  border-left: 100px solid #f0ad4e;
  border-bottom: 100px solid #f0ad4e;
}
<div class="apresentacao">
  <div class="texto">
    Aqui vem um texto qualquer
    <br/>texotexto.
  </div>

</div>

1 answer

5


See if that’s it:

.apresentacao {
  width: 0px;
  height: 0px;
  border-right: 100px solid transparent;
  border-top: 100px solid transparent;
  border-left: 100px solid #f0ad4e;
  border-bottom: 100px solid #f0ad4e;
}
.content {
  position: relative;
  width: 200px;
  height: 200px;
}
.texto {
  width: 50px;
  bottom: 10px;
  position: absolute;
  left: 10px;
}
<div class="content">
  <div class="apresentacao">
    <div class="texto">
      Aqui vem um texto qualquer
      texto
    </div>
  </div>
</div>

  • 2

    Absolute and relative position +1

  • Boy, I had put Absolute and relative before bad wasn’t working. What a strange thing. THANKS for the answer. I’ll see what happened!! :)

Browser other questions tagged

You are not signed in. Login or sign up in order to post.