javascript - VueJS データバインド オブジェクトのスタイリングが機能しない

Question

v-bind を使用して VueJS スタイリングをいじっていますが、v-bind インライン スタイリングから v-bind オブジェクト スタイリングに切り替えると、特定のことに気付きました。インライン スタイルは正常に機能します。ただし、Vue でオブジェクトを作成し、そのオブジェクトでスタイルを設定しようとすると、幅と高さはスタイルされませんが、残りはスタイルされます。

これはおそらく構文エラーであることに気づきました。高さと幅の値を引用符で囲んでみました。

<span :style="progbar">80%</span>

// styling:

progbar:{
   height: 20,
   width: 800,  
   backgroundColor: 'red',
   color: 'white',
   fontSize: '30px'

   }

幅 800 のバーが表示されるはずですが、それが表示されず、理由がわかりません。完全なコードはhttps://jsfiddle.net/totoro183/nho1jv37/51/にあります。