¿Cómo hacer un estilo de borde cortado diagonalmente a un div?

publicado por: Anonymous

Hola amigos quisiera que me ayuden, quiero darle un estilo a un div con un borde cortado que contiene un texto, tipo google, estoy intentando pero no puedo.
Les dejo el link para que vean,. es una encuesta online de google: http://goo.gl/forms/7cQEZDxNAo

Adjunto una imagen.
introducir la descripción de la imagen aquí

solución

Si usas la developer tools del browser, a la cual accedes con F12, puedes inspeccionar el html.

De esta forma podrias analiza el uso de los tag svg y polygon

_x000D_

_x000D_

.freebirdMaterialHeaderbannerSectionTriangleContainer {_x000D_
    flex-shrink: 0;_x000D_
    overflow: hidden;_x000D_
    position: relative;_x000D_
    width: 18px;_x000D_
}_x000D_
_x000D_
_x000D_
.freebirdSolidFill {_x000D_
    fill: #DB4437;_x000D_
    stroke: #DB4437;_x000D_
}

_x000D_

<div class="freebirdMaterialHeaderbannerSectionTriangleContainer">_x000D_
_x000D_
   <svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 10 10" preserveAspectRatio="none" class="freebirdMaterialHeaderbannerSectionTriangle"> _x000D_
  _x000D_
        <polygon class="freebirdSolidFill" points="0,0 10,0 0,10"></polygon>_x000D_
  _x000D_
   </svg>_x000D_
</div>

_x000D_

_x000D_

_x000D_

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *