HTML5 Progress bar not working on device

ionic-v1
1

<progress max="100" value="50" ></progress> Is working fine on web browser when I start ionic serve. But when I run it through an android emulator, the progress bar is not showing.

2

I’m using a progress element in my Ionic app. For Android it’s important to know what version you are on. The stock Android browser version 4.4 has support for <progress/> , lower versions don’t. Check the overview on http://caniuse.com/#feat=progress

You might also need some css pseudo classes to style the element:

progress {
display: block;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 100%;
height: 30px;
margin: 15px auto;
padding: 10px;
}

progress::-webkit-progress-bar {
background-color: #eee;
}

progress::-webkit-progress-value {
background-color: #bc0031;
}

1 Like
3

still, it’s not working when i install the app in the device, the progress bar is not showing