Home/ Questions/Q 3676976
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-19T03:09:55+00:00

I have some text rotated 270 degrees, which I would like to apply the

  • 0

I have some text rotated 270 degrees, which I would like to apply the -moz-box-shadow/box-shadow/-webkit-box-shadow CSS propert to. Unfortunately, the browsers all render the box shadow as if the text block element has not been rotated (i.e the shadow position is 90 degrees away from where it should be as if in standard left-to-right rendering)

Is there a way to overcome this problem?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    This works for me. Can you post your code so we can see what you’re doing? (For example one thing you could be doing is setting your transform – rotate on a span element but setting your box-shadow on a container div.)

    Here is some webkit code that works:

    #RRottatte{ -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(270deg);
width: 100px;
height: 100px;
top: 300px;
left: 200px;
-webkit-box-shadow: 6px 6px 0px red;
 }
</style>

</head>
<body>
<div id="RRottatte">My Rotated Text</div></body>
</html>
    • 0