<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div> <button type="button" class="btn btn-info">Info</button> <div class="global_informacion_detallada"> <div class="informacion_detallada"> <h5 class="element_detail" >Creador del parte:<br>pep</h5> <br> <h5 class="element_detail" >Informante del parte:<br>CLIENTE</h5> <br> <h5 class="element_detail" >Último modificador:<br>PEDRO CENTRAL</h5> <br> </div> </div> </div>

.informacion_detallada{ background-color: #00000042; border-color: grey; display:inline-block !important; border-radius:8px; color:white; padding: 5px; margin-top:20px; } .element_detail{ display:inline-block !important; font-size:16px; } .informacion_detallada:before { content:""; position: fixed; width: 0; height: 0; border-top: 14px solid #00000042; border-right: 14px solid transparent; border-left: 14px solid transparent; margin: 167px 0 0 42px; } .global_informacion_detallada{ display:relative !important; } button { margin:200px; } div { }