Clever Geek Handbook

Twitter Bootstrap Popovers - Multiple Width and Other CSS Properties

Is it possible to use multiple popovers of different widths, margins, paddings, etc. on the same web page?

I want to use a 300px wide popover for table fields and a 200px wide popover for links.

I'm familiar with the CSS properties of popovers, but I don't know how to use multiple popovers with different CSS properties.

+3


source to share


1 answer


You can override the default template with your own and then create it however you want with css.

Here's an example:



$("#example").popover({
      placement : 'bottom',
      template: '<div class="popover" style="width: 300px"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>',
      content : "Your content goes here."
});

Notice the inline style that sets the width to 300px. You would like to add your own class name to the element and create it with your own stylesheet.

+4


source






More articles:


All Articles