css shapes - CSS: Talk Bubble -


this question has answer here:

i have jfiddle right now. code found online implementing talk bubble https://jsfiddle.net/3l5abt5t/

however, when run code, triangle part seems green. want transparent , have green outline. sorry, new css. might simple fix. appreciated! thank you!

does have code?

.triangle-border.left:before {   top: 10px;   bottom: auto;   left: -30px;   border-width: 15px 30px 15px 0;   border-color: transparent #5a8f00; } 

.triangle-border  {      border: 5px solid #5a8f00;      border-radius: 10px;      padding: 20px;      position: relative;      width: 200px;      margin: 0 auto;  }  .triangle-border:before,   .triangle-border:after {      content: '';       position: absolute; top: 50%; left: -40px;      border: 20px solid transparent;	      border-right: 20px solid #5a8f00;           -webkit-transform: translate(0,-50%);      -ms-transform: translate(0,-50%);          transform: translate(0,-50%);  }  .triangle-border:after {      border-right: 20px solid white;      left: -33px;   }
<p class="triangle-border ">but element want.</p>


Comments

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

asynchronous - Python asyncio task got bad yield -

javascript - Complete OpenIDConnect auth when requesting via Ajax -