Changing the width of twitter bootstrap popover

by

You can change the popover’s dimensions with CSS:

.popover{
    width:200px;
    height:250px;    
}

But that CSS will change ALL popovers. What you need to do is put the button in a container element and use CSS like this:

#containerElem .popover {
  width:200px;
  height:250px;
  max-width:none; // Required for popovers wider than 276px (Bootstrap's max-width for popovers)
}

You also need to change data-container="#containerElem" to match your container.

NOTE: If your popover is going to have a width greater than 276px, you need to override the max-width property as well. So add max-width: none to the .popover {} class.

Here’s a jsFiddle: http://jsfiddle.net/4FMmA/

Leave a Comment