Using the THREE.js CSS2DRenderer to position HTML elements from the top left

The CSS2DRenderer allows me to place an HTML element in a scene based on a 3D position, which can in turn correspond to some object placed in the 3D scene. For example, I can do:

const mesh; // <some other mesh in the scene>

const el = document.createElement('div')
el.innerHTML = 'hello world'
const objectCSS = new CSS2DObject(el)
objectCSS.position.set(0, 0, 0)

mesh.add(objectCSS)

This will place the hello world div directly centered on the mesh, e.g.

_________________
|               |
|               |
|  hello world  |
|               |
|_______________|

How could I change the coordinates of the hello world div so that it is placed with respect to the top left of the div, instead of with respect to the center of the div? e.g.

_________________
|               |
|               |
|        hello world 
|               |
|_______________|

Note that the goal is not to just offset the text. I want to change the alignment. So for example, if I was just trying to offset, more text would look like like this:

_________________
|               |
|               |
|hello world bla|
|               |
|_______________|

wheres changing the alignment would look like this

_________________
|               |
|               |
|        hello world bla
|               |
|_______________|

Similarly, adding more text in the default offset view would look like:

_________________
|               |
|  hello world  |
|  hello world  |
|  hello world  |
|_______________|

but I want

 _________________
|                |
|                |
|       hello world  
|       hello world 
|_______hello world

Solution posted here: javascript - Using the THREE.js CSS2DRenderer to position HTML elements from the top left - Stack Overflow

You can get coordinates without CSS2DRenderer, something like this:

screenPosition=mesh.position.clone().project(camera);
x=(screenPosition.x+1)/2*width;
y=(1-screenPosition.y)/2*height;