[Fixed] Formatting a hardcoded json object in TypeScript with jagged array

Issue

Im probably being dumb here, but I dont understand why

  productSpecificStyling: any;

  this.productSpecificStyling = {
      headerDividerStyle: { height: "5px"},
      buttonNext: { color: "purple"},
      buttonPrevious: { color: "yellow" }
  };

works fine, but

  productSpecificStyling: any;

  this.productSpecificStyling = {
      headerDividerStyle: { height: "5px",width:"100px"},
      buttonNext: { color: "purple"},
      buttonPrevious: { color: "yellow" }
  };

raises an error complaining that theres a : expected.

Edit: Sorry guys, I had been experimenting when I pasted this, I guess its something to do with the – in background-color

  productSpecificStyling: any;

  this.productSpecificStyling = {
      headerDividerStyle: { height: "5px",background-color:"red"},
      buttonNext: { color: "purple"},
      buttonPrevious: { color: "yellow" }
  };

Solution

Maloric pointed the way. the hypen is not valid in a JSON Property, but I have to create it anyway!. enclosing it in [""] made it work. e.g.

 this.productSpecificStyling = {
      headerDividerStyle: { height: "5px",["background-color"]:"red"},
      buttonNext: { color: "purple"},
      buttonPrevious: { color: "yellow" }
  };