I am trying to create something that looks like a progress bar that is filled for 12.5% with red color and the rest is colorless (white like background) and has some text on it.
So far I got:
<div id="section6" style="border-color:Black;border-width:1px;;border-style:solid;width:100%;">
<div id="bar41" style="BORDER-RIGHT:1px solid;BORDER-TOP:1px solid;BORDER-LEFT:1px solid;WIDTH:200px;HEIGHT:20px;BORDER-BOTTOM:1px solid;">
<div id="progressBar41" style="WIDTH:12.5%;BACKGROUND-COLOR:red;HEIGHT:100%;">Test</div>
<span id="value41">Some Text<br>more text</span>
The only problem with above is that my bar displayed in two rows - first contains read and second contains text.
What I would like is a bar that had part red and part white and white part should contain the text
Is that possible to do?