Closed Bug 1200073 Opened 9 years ago Closed 9 years ago

[Computed view] Should NOT overlap elements

Categories

(DevTools :: Inspector, defect)

Product:
DevTools
Component:
Inspector
Version:
43 Branch
Type:
defect
Priority:
Not set
Severity:
minor

Tracking

(firefox41 wontfix, firefox42 affected, firefox43 affected, firefox44 affected)

Status:
VERIFIED FIXED
Milestone:
Firefox 44
Tracking Flags:
Tracking Status
firefox41 --- wontfix
firefox42 --- affected
firefox43 --- affected
firefox44 --- affected

People

(Reporter: magicp.jp, Assigned: bgrins)

References

Details

(Keywords: regression, Whiteboard: [polish-backlog][difficulty=easy])

Attachments

(3 files)

dom-inspector-computed-overlap-elements.png
(deleted), image/png
Details
MozReview Request: Bug 1200073 - Use extra space before the computed view checkbox so it's not touching the sibling text input;r=pbrosset
(deleted), text/x-review-board-request
pbro
: review+
Details
checkbox-overlaps-at-placeholder.png
(deleted), image/png
Details
User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:43.0) Gecko/20100101 Firefox/43.0 Build ID: 20150830030224 Steps to reproduce: 1. Run Firefox 41.0 beta (and later) 2. Open DOM Inspector - Computed view 3. Change pane width narrowed Actual results: Search box and checkbox is overlapped. Expected results: Should NOT overlap elements. Firefox 40.0 works well.
Component: Untriaged → Developer Tools: Inspector
Regression between 40 and 41
Severity: normal → minor
Status: UNCONFIRMED → NEW
status-firefox41: --- → affected
status-firefox42: --- → affected
status-firefox43: --- → affected
status-firefox44: --- → affected
Ever confirmed: true
Keywords: regression, regressionwindow-wanted
Whiteboard: [polish-backlog][difficulty=easy]
Gabriel's internship is over, so redirecting the request to Brian.
Flags: needinfo?(gabriel.luong) → needinfo?(bgrinstead)
Looks like it may be some weird interaction between css flex and xul flex with the text input and the checkbox
Bug 1200073 - Use extra space before the computed view checkbox so it's not touching the sibling text input;r=pbrosset
Attachment #8675168 - Flags: review?(pbrosset)
I don't fully get why this is happening, but this is a simple css change that fixes it for me locally
Assignee: nobody → bgrinstead
Status: NEW → ASSIGNED
Flags: needinfo?(bgrinstead)
Comment on attachment 8675168 [details] MozReview Request: Bug 1200073 - Use extra space before the computed view checkbox so it's not touching the sibling text input;r=pbrosset https://reviewboard.mozilla.org/r/22339/#review19955
Attachment #8675168 - Flags: review?(pbrosset) → review+
Keywords: checkin-needed
https://hg.mozilla.org/mozilla-central/rev/c87fabaa02a5
Status: ASSIGNED → RESOLVED
Closed: 9 years ago
status-firefox44: affected → fixed
Resolution: --- → FIXED
Target Milestone: --- → Firefox 44
Attached image checkbox-overlaps-at-placeholder.png (deleted) —
Checkbox still overlaps at placeholder. Please find attached image.
Status: RESOLVED → REOPENED
status-firefox44: fixed → affected
Resolution: FIXED → ---
Ok I looked closely and found out that the same is happening with filter field in ruleview. Currently inner input (.devtools-searchinput) has "margin: 1px 3px;", and .devtools-searchbox (parent element) has "padding:0px;". Removing margin-left/right from search input and adding the same padding to searchbox solves the issue Example of CSS which works for me: > .devtools-searchbox { -moz-padding-start: 3px !important; } > .devtools-searchbox { -moz-padding-end: 3px !important; } > .devtools-searchinput { -moz-margin-start: 0px !important; } > .devtools-searchinput { -moz-margin-end: 0px !important; }
(In reply to arni2033 from comment #11) > Ok I looked closely and found out that the same is happening with filter > field in ruleview. > Currently inner input (.devtools-searchinput) has "margin: 1px 3px;", and > .devtools-searchbox (parent element) has "padding:0px;". > Removing margin-left/right from search input and adding the same padding to > searchbox solves the issue > Example of CSS which works for me: > > .devtools-searchbox { -moz-padding-start: 3px !important; } > > .devtools-searchbox { -moz-padding-end: 3px !important; } > > .devtools-searchinput { -moz-margin-start: 0px !important; } > > .devtools-searchinput { -moz-margin-end: 0px !important; } Yeah I think Comment 10 this is a separate, existing bug unrelated to Bug 987365. I'll file a new bug for that
Status: REOPENED → RESOLVED
Closed: 9 years ago → 9 years ago
Resolution: --- → FIXED
(In reply to Brian Grinstead [:bgrins] from comment #12) > (In reply to arni2033 from comment #11) > Yeah I think Comment 10 this is a separate, existing bug unrelated to Bug > 987365. I'll file a new bug for that There was a misunderstanding, but now I understand what's happening.
See Also: → https://bugzilla.mozilla.org/show_bug.cgi?id=1216615
Fixed by... bug 1216569 bug 1216615 Thanks all!
Status: RESOLVED → VERIFIED
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: