Closed Bug 1324746 Opened 5 years ago Closed 5 years ago

[RTL] Fix camera icon on Toolbox Options


(DevTools :: Framework, defect, P3)



(firefox53 fixed)

Firefox 53
Tracking Status
firefox53 --- fixed


(Reporter: tomer, Assigned: tomer)


(Blocks 1 open bug, )


(Keywords: rtl)


(2 files)

The fix for bug 1323504 introduced a problem with the camera icon. Because this change involves changing the common.css file, I am using this bug to track the changes. 

Comment on attachment 8820222 [details]
Bug 1324746 [RTL] Fix camera icon on Toolbox Options

Thanks for the patch!

::: devtools/client/themes/common.css:284
(Diff revision 1)
>  .devtools-button::before {
>    content: "";
>    display: block;
>    position: absolute;
> -  left: 50%;
> +  offset-inline-start: 50%;

Shouldn't we use offset-block start instead of top to be consistent?

This fixes the camera-icon but it took me a while to understand why. The top/left 50% + negative margins is a pattern used for centering absolutely positioned elements, and by itself doesn't need to use logical properties.

But here the margin-inline-start: -8px now gets overridden by . Before it was only overridden in LTR, when margin-left ~= margin-inline-start.

I don't think the icon position should be adjusted by overriding margins the ::before pseudo, but that's not related to your changeset.
Attachment #8820222 - Flags: review?(jdescottes) → review+
Keywords: checkin-needed
Pushed by
[RTL] Fix camera icon on Toolbox Options r=jdescottes
Keywords: checkin-needed
Closed: 5 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 53
Working fine in latest Nightly.
I have reproduced this bug with Firefox nightly 53.0a1 (2016-12-20)on Windows 10, 64 Bit.

The Bug's fix is now verified on latest Beta 53.0b3 !

Build ID 	20170316045436
User Agent 	Mozilla/5.0 (Windows NT 10.0; WOW64; rv:53.0) Gecko/20100101 Firefox/53.0

Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.