-1

I have a page designed in angular bootstrap. I am trying to use a popover as follws ..

<div class="col-md-4">
  <div class="row">
    <ul>
    <a href="" uib-popover-template="'popOverEditTemplate.html'" popover-popup-close-delay='500' popover-placement="bottom-left"> AM TEST AM </a>
    </ul>
  </div>
</div>

The template I am using pops over fine, but I could not increase the size of the popover whatsoever.

How can I increase the size of the popover?

Sushant
  • 3,499
  • 3
  • 17
  • 34
Ahadu Melesse
  • 91
  • 1
  • 1
  • 8

1 Answers1

0

You can simply do this using CSS

<style>
  .popover{ /* Will change ALL popovers. Add element id to target specific popver */
    max-width: 100%
  }
</style>
sjokkogutten
  • 2,005
  • 2
  • 21
  • 24
  • – Ahadu Melesse Oct 27 '16 at 14:47
  • http://jsfiddle.net/3x4yD/ You can see the effect of increasing the width (it only increases the content with in it, not the actual content window). – Ahadu Melesse Oct 27 '16 at 15:15
  • I think the problem is that the popover is dependent on the parent container. Adding `.popover{ max-width: 100% }` should solve this. You can read more about this topic here: http://stackoverflow.com/questions/19448902/changing-the-width-of-bootstrap-popover – sjokkogutten Oct 28 '16 at 06:16