Add wrapper div to value bubble to aid CSS centering

Is it possible to get an extra wrapper div around the slider-bubble value element?... so it makes it nice and easy to center it perfectly above the slider handle (regardless of the value). My code looks like this...

JS
var bubble = $('<div class="sliderfield-bubble-wrapper"><div class="sliderfield-bubble">' + bubble_value + '</div></div>');

CSS

.sliderfield-bubble-wrapper {
    float: right;
    right: 50%;
    position: relative;     
}
.sliderfield-bubble {
    float: right;
    right: -50%;
    position: relative;    
}

Unless of course this can be achieved without the additional div, but I just cant seem to find a way to do that.

Thanks