How to resize twitter bootstrap popover?

How to resize twitter bootstrap popover?

I am using bootstrap in my mvc project. I have an issue with bootstrap
popover widget. I have created a custom knockout binding for popover
widget, here the code :
Check fiddle
ko.bindingHandlers.popover = {
init: function (element, valuesAccessor, allBindingsAccessor,
viewModel, bindingContext) {
var options = ko.utils.unwrapObservable(valuesAccessor() || {});
options.html = true;
options.content = '<small class="text-info">' + 'Variable text
goes here.Variable text goes here.Variable text goes
here.Variable text goes here.Variable text goes here. ' +
'</small>';
$(element).popover(options);
},
update: function (element, valuesAccessor, allBindingsAccessor,
viewModel, bindingContext) {
var extraOptions = allBindingsAccessor().popoverOptions;
$(element).popover(extraOptions.observable() ? "show" : "hide");
$(element).siblings('.popover').css({ width: '150px' });
//IF YOU UN-COMMENT BELOW 2 LINES THAN EVERY THINGS WORKS FINE
//if(extraOptions.observable())
//$(element).popover('show');
}
};
function vm() {
var self = this;
self.isVisible = ko.observable(false);
self.open = function () {
self.isVisible(!self.isVisible());
};
}
ko.applyBindings(new vm());
I want to initialize popover on any element with variable text message and
with variable size. Every thing goes ok but when i change the default
width of the popover than on first time when it open its position is not
correct (please check the behavior in fiddle).
There was some line of code in the fiddle which if you uncomment than this
issue solve. But i feel it is a hacky approach, i want some better way to
handle if there is any ?