Elements injected via Google Chrome extension don't behave as normal ones

Question

I'm trying to make a Google Chrome extension. I want to add a div element to a page via a content script. My code looks like this

const parser = new DOMParser();
const nodeToInsert = parser.parseFromString('<div id="myId" style="position: absolute; left: 100px; top: 100px">Hi there!</div>', "text/xml");
document.getElementsByTagName("body")[0].appendChild(nodeToInsert.getElementById('myId'));

It adds the element, but not the CSS: the element is at the bottom of my page (not at the position 100px 100px). By the way, it works when I add the element manually via inspect.