I want to apply custom CSS to the title and content of a popover in Bootstrap, however, it seems that my CSS is being ignored.
How can I apply specific CSS to the title and the content respectively?
For example: http://jsfiddle.net/Mx4Ez/
The reason appears to be that the javascript is creating brand new elements to display the popover itself. These new elements have different css class names than the original.
Try adding this to your css:
.popover-title {
color: blue;
font-size: 15px;
}
.popover-content {
color: red;
font-size: 10px;
}
Update
Depending on the library version you're using, the names may be different. If the above does not work, try using .popover-header
and .popover-body
instead.