Range slider not working

Hello everybody

I am trying to make a range slider inside a trait, where i can change a div height. I created a new component and inside of it i created a trait.

I tried to make a solution with a selectbox that seems working. But now i will try to do that with a range slider, but i really dont know how to make it. Its not working and not changing the height.

Hope anyone can help me solve this

editor.DomComponents.addType('spacercomp', {
    model: {
      defaults: {
          toolbar: [{
        attributes: {class: 'fa fa-arrows'},
        command: 'tlb-move',
      },
      {
        attributes: {class: 'fa fa-arrow-up'},
        command: 'moveUp-command',
      },
      {
        attributes: {class: 'fa fa-arrow-down'},
        command: 'moveDown-command',
      },{
        attributes: {class: 'fa fa-clone'},
        command: 'tlb-clone',
      },{
        attributes: {class: 'fa fa-arrows'},
        command: 'tlb-move',
      },{
        attributes: {class: 'fa fa-trash'},
        command: 'tlb-delete',
      }],
       traits: [
          // Strings are automatically converted to text types
			{// this is working. 
            type: 'select', // Type of the trait
            label: 'Højde', // The label you will see in Settings
            name: 'style', // The name of the attribute/property to use on component
            unit: 'px',
            placeholder: 'Vælg højde',
            options: [
              { value: 'height:10px', name: '10px'},
              { value: 'height:20px;font-size:20px;', name: '20px'},
              { value: 'height:30px', name: '30px'},
              { value: 'height:40px', name: '40px'},
            ]
          },{// this is not working.. what i am missing?
            label: 'Højde', // The label you will see in Settings
            name: 'style', // The name of the attribute/property to use on component
            type: 'range',
            min:'10',
            max:'100',
          }


          ],

      },
    },
});