Why element.style always return empty in JS?

element.style returns the inline style used in html document and since the style is not set directly in html you will get and empty value

What you are looking for is the computedStyle which will returns the style that is applied to the element

console.log(window.getComputedStyle(document.getElementById('test')).display)

#map {
      display: block;
      align-content:center;
    }

<div id="test">test</div>