Search code examples
jquerycsstwitter-bootstrappopover

Bootstrap popover top-right corner always on top

How can I make my popover display in the top-right corner of the page, without it being connected with an arrow to the button, kind of like a popup? Should I use something else than a popover?

<button type="button" class="btn btn-default" title="Help" data-toggle="popover"  data-content="423241421453453"><span class="glyphicon glyphicon-info-sign" style="font-size: 20px; padding-top:5px"></span></button>
</div>


<script>
        $(document).ready(function popover() {
            $('[data-toggle="popover"]').popover();
        });
</script>
Solution

  • You can do this:

    CSS

    .popover{
    position: absolute;
    top:0;
    right:0;
    left: 80% !important;

}

.popover .arrow{
    display:none;           
}

    Adjust your needs

    DEMO HERE