# CSS3DObject reverse

**URL:** <https://discourse.threejs.org/t/css3dobject-reverse/23108>\
**Category:** Questions\
**Tags:** controls, orbit-controls\
**Created:** [February 3, 2021, 11:06pm UTC](https://discourse.threejs.org/t/css3dobject-reverse/23108 "2021-02-03T23:06:03Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![laugh52](https://avatars.discourse-cdn.com/v4/letter/l/6a8cbe/32.png) [@laugh52](https://discourse.threejs.org/u/laugh52)\
**Post date:** [February 3, 2021, 11:06pm UTC](https://discourse.threejs.org/t/css3dobject-reverse/23108/1 "2021-02-03T23:06:04Z")

</div>

Hey guys,

I have a 3D Character in my scene and some text/links rotating around him. The problem is when the text is infront of the Cam the text is reversed. See picture:

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/c/c/ccb5a63009f4c643829168a44553513935802903.jpeg)

In the back it is normal, but I want to be reversed in the back, not in the front

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/1/4/14869358ed38f0221fbb735b50e23ad1c738bbc9.jpeg)

My Code looks like this:  
 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/6/7/67aa440b6efc6b13a9ac78f1f73e3d173707d330.png)

I have tried el.style.rotate = “rotate(7deg)”, obj.rotation.x … but nothing worked

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [February 3, 2021, 11:08pm UTC](https://discourse.threejs.org/t/css3dobject-reverse/23108/2 "2021-02-03T23:08:35Z")

</div>

You can try updating the direction text object is looking (mind, you should do it on every frame):

```javascript
obj2.lookAt(camera.position);

```

It’s also a good idea to place text in an empty `Group` or `Object3D` that’ll act like a pivoting point. Instead of changing position of the text, move the pivot - that way rotations of the text object will always apply with regard to its centre point.

---

<div class="post-metadata">

**Author:** ![laugh52](https://avatars.discourse-cdn.com/v4/letter/l/6a8cbe/32.png) [@laugh52](https://discourse.threejs.org/u/laugh52)\
**Post date:** [February 3, 2021, 11:13pm UTC](https://discourse.threejs.org/t/css3dobject-reverse/23108/3 "2021-02-03T23:13:31Z")

</div>

the lookAt function didnt worked for me…  
what do you mean with placing text in an empty group/object ? Its my first week with threejs im sorry

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [February 4, 2021, 6:43pm UTC](https://discourse.threejs.org/t/css3dobject-reverse/23108/4 "2021-02-04T18:43:49Z")

</div>

Maybe [this](https://codepen.io/mjurczyk/pen/xxRZVmX?editors=0010) will help a bit.

Placing an object inside an empty group - and then moving that group instead of the object - ensures object rotations are always around it’s centre point.

---

<div class="post-metadata">

**Author:** ![GlifTek](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/gliftek/32/13131_2.png) [@GlifTek](https://discourse.threejs.org/u/GlifTek)\
**Post date:** [February 5, 2021, 6:45am UTC](https://discourse.threejs.org/t/css3dobject-reverse/23108/5 "2021-02-05T06:45:22Z")

</div>

Why not apply a negative x scaling to the text object?

Var textObject.scaleX = -1;