Bug 24919 - CSS transformations do not work with inline elements
: CSS transformations do not work with inline elements
: WebKit
: 528+ (Nightly build)
: PC All
: P5 Trivial
Assigned To:
  Show dependency treegraph
Reported: 2009-03-29 03:28 PST by
Modified: 2009-06-08 13:01 PST (History)

Testcase (197 bytes, text/html)
2009-04-02 04:39 PST, CHL
no flags Details


You need to log in before you can comment on or make changes to this bug.

Description From 2009-03-29 03:28:34 PST
CSS transforms do not seem to work with :hover. Checked with Chrome and (nightly) WebKit GTK. Presumably also affects WebKit on OS X.
------- Comment #1 From 2009-03-30 05:50:56 PST -------
After a bit of checking it seems that this only affects inline elements. On Mozilla -moz-transform affects both block and inline, while here -webkit-transform only affects inline. This happens regardless of whether :hover is used.
------- Comment #2 From 2009-04-01 16:58:23 PST -------
Could you provide a testcase to confirm that ?
------- Comment #3 From 2009-04-02 04:39:11 PST -------
Created an attachment (id=29188) [details]

Testcase attached. The word "ordinary" should be rotated by 180 degrees, but isn't.
------- Comment #4 From 2009-04-03 09:59:50 PST -------
Copying Simon to determine if it's a bug or not.

As a workaround now, you can use "display: inline-block;"
------- Comment #5 From 2009-04-03 10:04:47 PST -------
This is by design. Transforms only work on block-level elements. They really don't make too much sense on inlines, especially if the inline in broken over several lines -- where would the transform origin be?
------- Comment #6 From 2009-04-03 18:59:51 PST -------
Maybe it can be done the way Gecko does it, transforming each line individually?
------- Comment #7 From 2009-06-08 13:01:52 PST -------
*** Bug 26257 has been marked as a duplicate of this bug. ***