html - Text Progress bar (Email) -
i developing template email , i'have developed :
<table style="border:0;" cellpadding="0" cellspacing="0" width="250"> <tr> <td bgcolor="#f83f83" style="width:50%; background-color:#f83f83; float:left; height:15px;"></td> <td bgcolor="#cccccc" style="width:50%; background-color:#cccccc; float:left; height:15px;"></td> </tr> </table>
but dynamic percentage indicated in center of progress bar. have solution make compatible email client quite capricious ?
thanks
it's tricky centre text on progress bar, because can't put on top of table - position:absolute;
won't work on email clients.
however, try like:
<table style="border:0;" cellpadding="0" cellspacing="0" width="250"> <tr> <td bgcolor="#f83f83" style="width:50%; background-color:#f83f83; float:left; height:15px;text-align:right;">5</td> <td bgcolor="#cccccc" style="width:50%; background-color:#cccccc; float:left; height:15px;text-align:left;">0%</td> </tr> </table>
this mean percentage on current location of progress bar, example:
<table style="border:0;" cellpadding="0" cellspacing="0" width="250"> <tr> <td bgcolor="#f83f83" style="width:35%; background-color:#f83f83; float:left; height:15px;text-align:right;">3</td> <td bgcolor="#cccccc" style="width:65%; background-color:#cccccc; float:left; height:15px;text-align:left;">5%</td> </tr> </table>
Comments
Post a Comment