Example from translateX page does not work on codepen and JSFiddle

RESOLVED FIXED

Status

Developer Documentation
CSS
P5
normal
RESOLVED FIXED
2 years ago
2 years ago

People

(Reporter: David Bruant, Unassigned)

Tracking

Details

(URL)

(Reporter)

Description

2 years ago
:: Developer Documentation Request

      Request Type: Correction
     Gecko Version: 45 Branch
 Technical Contact: 

:: Details

The live example on MDN does work as expected (10px shift), however, it does not work on codepen.io and jsfiddle (the 3 boxes are aligned).
Not sure why there is a difference at all.
Noticed on Firefox 45.0a2 (2016-01-17) on Linux (Ubuntu)

Sorry I don't have the time to investigate right now on where this difference comes from.
This is weird. I see the same with Firefox, Chrome and Safari (OS X): correct in the live sample of MDN, wrong in jsfiddle or codepen.
Fixed: there was a strange carriage return at the beginning of the transform line.

It was stripped for use on MDN, but made the entry invalid in codepen/jsfiddle

I cleaned the spaces (visually identical) and now it works.

I still find this a bit weird as there was no error in the console and I wasn't able to discover what character it was (don't have an hex editor handy), but it is gone now.
Status: NEW → RESOLVED
Last Resolved: 2 years ago
Resolution: --- → FIXED

Comment 3

2 years ago
It is likely to be due to " " that were present in source mode. Not sure how I put them here but removing them (only) fixes the issue. I'll fix the different examples.
You need to log in before you can comment on or make changes to this bug.