I need to create a series of stoplights that are colored based on a percentage number that would show up in the middle of them. My percentage scales would be based on 0%-100% and broken down in increments of 10. Each percentage would be a gradient color from red to green. I found some code but not sure how to tie it all together and get them into a report.
Here is the code I found.
.circle {
width: 500px;
height: 500px;
line-height: 500px;
border-radius: 50%;
font-size: 50px;
color: #fff;
text-align: center;
background: #000
}
<div class="circle">Hello I am A Circle</div>
------------------------------
Joey Zint
------------------------------
