jquery align progress bar

this is my situation:

HTML

<p>Controlla mail</p>
<div class="progressbar"></div>

JS

jQuery(function($) {
    $开发者_如何学C(".progressbar").progressbar({ value: 10 });
});

http://jsfiddle.net/michelejs/SByqS/

How can I align the progress bar with check mail text?

Here: DEMO JSFiddle

Or with jQuery only:

DEMO2

jQuery(function($) {
    $(".progressbar").progressbar({
        value: 10
    }).css({marginLeft:'100px'}).prev('p').css({float:'left', lineHeight:'34px'});

});

Try http://jsfiddle.net/mraufk/4K8X2/1/

jQuery(function($) {
    $(".progressbar").progressbar({ value: 10 });
    $(".progressbar").css('width', '85px'); 
});

Here is the code:

jQuery(function($) {

$(".progressbar").progressbar({ value: 10 });

$(".progressbar").css('margin-left', '90px');

$('p').css('float','left');

});