[Vuejs]-Vue `$refs` issues

You should use a mounted hook to get access to the refs, because on "created" event is just instance created not dom.
https://v2.vuejs.org/v2/guide/instance.html

You should always first consider to use computed property and use style binding instead of using refs.

<template>
    <div :style="calculatedStyle" > ... </div>
</template>
<script>
{
//...
    computed: {
      calculatedStyle (){
        top: someCalculation(this.someProp),
        left: someCalculation2(this.someProp2),
        ....
      }
    }
}
</script>

It’s bad practice to pass ref to another component, especially if it’s no parent-child relationship.
Refs doc
Computed