kgp43
asked on
How to center jQuery Progress bar text
Hi,
I have this jQuery progressbar but have problems to center the text.
I can use margin-left:50%, but thats not 100% accurate.
Is it possible to use text-align:center instead? if so, how?
JS:
CSS:
I have this jQuery progressbar but have problems to center the text.
I can use margin-left:50%, but thats not 100% accurate.
Is it possible to use text-align:center instead? if so, how?
JS:
$(function() {
var progressbar = $( "#progressbar" ),
progressLabel = $( ".progress-label" );
progressbar.progressbar({
value: false,
change: function() {
progressLabel.text( "Loading image (" + progressbar.progressbar( "value" ) + "%)" );
},
complete: function() {
/*progressLabel.text( "Complete!" );*/
$('.hideme')
.hide()
;
$('.showme')
.fadeIn(2000)
;
}
});
function progress() {
var val = progressbar.progressbar( "value" ) || 0;
progressbar.progressbar( "value", val + 1 );
if ( val < 99 ) {
setTimeout( progress, 70 );
}
}
setTimeout( progress, 1000 );
});
CSS:
/****** PROCESS BAR ****/
.progress-label {
float: left;
#margin-left: 50%;
margin-left: 20px;
margin-top: 5px;
font-weight: bold;
text-shadow: 1px 1px 0 #fff;
}
Any way we can see it in action? Like a live link or rendered HTML?
ASKER
use margin:auto; Make sure it comes after other margin settings, and if the query has not done something stupid like applying an inline style it should center.
Cd&
Cd&
ASKER
I tried to add margin:auto after all over margins, but the text just align left (like there is no alignment working).
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
That was simple, thanks a lot :D
ASKER
Excellent :D
:)
golden rule: KISS
(w/o the makeup)
golden rule: KISS
(w/o the makeup)