Ryan Salmons Ryan Salmons - 6 months ago 55
Javascript Question

Change bootstrap popover background color

I am trying to change the CSS on a bootstrap popover. I want to change the entire popover background, not just the text.

Any suggestions?

http://bootply.com/110002

$(document).ready(function() {
$("[rel='android']").popover({
html: 'true',
content: '<div id="popOverBox">Coming March 2014</div>'
});
});


CSS

#popOverBox {
background: tomato;
font-family: serif;
}

Answer

You would target the .popover element as opposed to #popOverBox

EXAMPLE HERE

.popover {
    background: tomato;
}

And to change the background of the arrow (pseudo element), you would use:

.popover.bottom .arrow:after {
    border-bottom-color: tomato;
}
Comments