Vivaldi native progressbar inner animation doesn't work? Please confirm.

  • Windows 8.1, recently i notice the animate-stripes animation inside the download panel isn't really "moving". Thus i decided to test the download panel's progress bar animation with the addressfield's progressbar...

    .panel#downloads progress {
      -webkit-appearance: none;
      height: 6px;
      width: 100%;
      display: block;
      margin: 3px 0;
      outline: 1px solid rgba(255, 255, 255, 0.25);
      outline-offset: -1px;
    .panel#downloads progress[value]::-webkit-progress-bar {
      background-color: #eee;
      border-radius: 0;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) inset;
    .panel#downloads progress[value]::-webkit-progress-value {
      background-image: linear-gradient(90deg, #158dff 0%, #006ed7 50%, #158dff 98%);
      background-size: 35px 20px, 100% 100%, 100% 100%;
      animation: animate-stripes 5s linear infinite;
      box-shadow: inset 0 0 4px 2px rgba(161, 222, 255, 0.5);
    @keyframes animate-stripes {
      100% {
        background-position: -100px 0;

    Lo & behold! It doesn't work there either... Or maybe it just not working as intended? After some investigation, it seems the animation ONLY move the stripes backward when the progress[value] is static, in a non-progressing state. Else, the background-image inside the progressbar will reset to default position. It seems Vivaldi is struggling to display the correct background-image position when the width of progress bar is changing...

    Anyone can confirm this is also happening to your Vivaldi browser, or it's just me? i will need more confirmation b4 filing a bug report.


  • Moderator

    Which Vivaldi version is this?

  • @gwen-dragon Not the latest, but i have notice this behavior since long time ago...
    1.14.1077.41 (Stable channel) (32-bit).
    Will update tonight when get home.


Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.