2

Fala galera! Tenho uma div .apresentacao, nela apliquei bordas para se tornar um triangulo. Beleza, más quero colocar um texto acima, porém com as bordas modificadas da .apresentacao, não fica alinhado. Como posso melhorar esse meu codigo? Obrigado pessoal! :)

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>

0

1 Resposta 1

5

Veja se é isso:

.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
  • 2
    Posição absoluta e relativa +1
    – BrTkCa
    Commented 21/12/2016 às 12:42
  • Rapaz, eu tinha colocado absolute e relative antes más não tava funcionando. Que coisa estranha. OBRIGADO pela resposta. vou ver o que aconteceu!! :) Commented 21/12/2016 às 12:51

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .