New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.
Starred by 9 users

Issue metadata

Status: Fixed
Closed: Feb 2012
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 2
Type: Feature

  • Only users with EditIssue permission may comment.

Sign in to add a comment

Issue 66628: Checkboxes in CSS Debugger should be to the left side !

Reported by, Dec 12 2010

Issue description

Chrome Version       : <Copy from: 'about:version'>
URLs (if applicable) :
Other browsers tested:
Add OK or FAIL after other browsers where you have tested this issue:
Safari 5:
Firefox 3.x:
IE 7/8:

What steps will reproduce the problem?

When you want to disable/enable style in CSS debugger, checkboxes are right side the css properties.

What happens instead?

This is not handy, it should be to the left side, as FireBug does, near the css properties text !

Comment 1 by, Dec 12 2010

Labels: -Type-Bug -Area-Undefined Type-Feature Area-WebKit Feature-DevTools

Comment 2 by, Dec 20 2010

Labels: Mstone-X

Comment 3 by, Jan 27 2011

Status: Available

Comment 4 by, Feb 10 2011

Please update the css DevTools.css

#line 4734
.styles-section .properties .enabled-button
    display:block;   /*modified*/
    float: left;     /*modified*/
    font-size: 10px;
    margin: 1px 2px 0 0px;   /*modified*/
    vertical-align: top;
    position: relative;
    z-index: 1;

With the check box always visible and on the left, it is very convenient for developers !
I hope you understand my point of view, this is the main reason I use firebug to debug css, so if you apply this fix, I think more developers will use Chrome DevTools.

Comment 5 by, Feb 10 2011

Pavel/Alexander, what do you think?

Comment 6 by, Feb 10 2011

The issue is being tracked upstream as

The suggested solution dramatically breaks the layout of expandable shorthands and invalid properties (having an exclamation mark next to their names). A quick test is:

div {
  height: 100%; /* OK */
  border: 1px solid black; /* Checkbox between arrow and property name */
  width: 100%; /* OK */
  -moz-opacity: 0.5; /* Property not aligned with the others */

Comment 7 by, Feb 10 2011

Sure but you can adapt the css for the layout problems

* invalid properties: 

.styles-section .properties li.not-parsed-ok {
margin: 1px 0 0px 13px;

* child properties:

.styles-section .properties ol {
margin: 0px 0px 0px 20px; /*modified*/


Comment 8 by, Feb 10 2011

Oh, I don't mean to say it is impossible (otherwise the upstream bug would have been closed as WONTFIX :)). Instead, my comment was intended to link this bug to an upstream one.

If the suggested changes pass a UI review, I believe the issue will be resolved in a positive manner, especially given other similar requests.

Comment 9 by, Feb 10 2011

Ok so many thanks :) I hope this will be done soon ^^

Comment 10 by, Apr 11 2011

No news since two monthes, it didn't pass the UI reviews?

Comment 11 by, Apr 30 2011

I think the left-aligned checkboxes in IE's devtools are rather ugly, myself and prefer to keep them somewhat out of sight.

A compromise solution may be... to provide a hover background for the row, so its at least easier to associate the form control with the style.

Comment 12 by, Apr 30 2011

The fact is it's not convenient on the right side. It's ugly because there are checkboxes, firebug show an icon hen style are disabled and it's convenient and not ugly (not pretty, just not ugly :) )

Comment 13 by, May 17 2011

Cc: a deleted user
 Issue 82660  has been merged into this issue.

Comment 14 by, Jun 12 2011

To complete my purpose, the actual disposition is opposite to the proximity law in ergonomy, could you reconsidere this issue, it's opened for a while...

Comment 15 by, Jun 14 2011

He said it was upstream.  That means its in the Webkit engine, not the core Chrome codebase.  Webkit needs to deal with it, because the Chromium team isn't going to be a big fan of maintaining a forked Webkit deployment.

Comment 16 by, Jun 14 2011

Ok I see, but where can i found and follow this issue at webkit website ? It's not clear...

Comment 17 by, Jun 14 2011

I completely agree on this being unclear - it's like these issues get acknowledged and then lost in the ether.

Comment 18 by, Jun 14 2011

Status: ExternalDependency
The upstream WebKit bug is noted in Comment 6

Comment 19 by, Jun 14 2011

Just a thought - will the Chrome team update on any Webkit progress / resolution on this feed? Or this feed dead now?

Comment 20 by, Jun 22 2011

Got it ! I comment the upstream link in webkit.

Comment 21 by, Feb 17 2012

Labels: -Mstone-X Mstone-19
Status: Fixed
Upstream bug:
Patch landed:
DEPS rolled

Comment 22 by, Oct 13 2012

Project Member
Labels: Restrict-AddIssueComment-Commit
This issue has been closed for some time. No one will pay attention to new comments.
If you are seeing this bug or have new data, please click New Issue to start a new bug.

Comment 23 by, Mar 10 2013

Project Member
Labels: -Area-WebKit -Feature-DevTools -Mstone-19 Cr-Content Cr-Platform-DevTools M-19

Comment 24 by, Mar 14 2013

Project Member
Labels: -Restrict-AddIssueComment-Commit Restrict-AddIssueComment-EditIssue

Comment 25 by, Apr 6 2013

Project Member
Labels: -Cr-Content Cr-Blink

Sign in to add a comment