Help to fix javascript progress bar!

Hey guys!
I have a progress bar written in javascript. Its pretty simple, consisting of a couple divs, where the inside one grows with the given percentage.

Anyways, the problem we are having is that sometimes the percentage that is dynamically calculated is over 100% (we are using it as an job completion progress bar, so if more hours are spent than estimated the bar will be over 100%.

I guess thats fine, except the inside div goes right off the container and keeps growing. Can we make the inside div max out at 100% somehow? Hoping someone can help me out with this, im not sure how this can be done! :D:D

I should add that the original script with example I found here: alpinemeadow.com/stitchery/weblog/HTML-morsels.html

Here is the original code:

<script language="javascript">
function drawPercentBar(width, percent, color, background)
{var pixels = width * (percent / 100);
if (!background) { background = "none"; }
document.write("<div style=\"position: relative; line-height: 1em; background-color: "
+ background + "; border: 1px solid #979797; width: "
+ width + "px\">");
document.write("<div style=\"height: 1.5em; width: " + pixels + "px; background-color: "
+ color + ";\"></div>");
document.write("<div style=\"position: absolute; text-align: center; padding-top: .25em; width: "
+ width + "px; top: 0; left: 0\">" + percent + "%</div>");
document.write("</div>"); }
</script>

Called for here:
<script language="javascript">drawPercentBar(171, <%=totaltotal/EstHours*100%>, '#aadba2', '#F2F2F2'); </script>

Perhaps outer div to have "overflow:hidden" in the CSS style.

solved. i actually just wrote an asp if statement... if over 100, display only up to 100.

thanks!

solved. i actually just wrote an asp if statement... if over 100, display only up to 100.

thanks!

I'm interested, what exactly was the line of code that you used tsolve the problem?