Changes to style.css in Chrome workspaces not showing up - css

Question

I've been trying to use Chrome Workspaces to edit the CSS in my WordPress child theme more efficiently. I followed the tutorial at http://wordimpress.com/using-chrome-devtools-workspaces-for-faster-wordpress-development/ to set it up. It works for the most part, when I edit any element in my child theme, the modification shows up instantly in my browser window and I can save it directly to the local style.css .
The problem occurs when I want to add a new element to my child theme (this element already exists in the parent theme but I did not need to modify it before, so it doesn't exist in the child theme). Using the inspect tool, I found the element in the parent style.css, then copied it over to my child theme editor (in the Source tab of devtools). But making any modifications to that element is not reflected in the live browser once I do that.
For instance, this was the original code in the parent style:
media="all"
.widget a {
color: #777;
}
And I copied this to my child stylesheet and changed it to color: #000 . But there is no change in the color seen in the live browser.
Am I doing something wrong?

Answer 1

If you are using Google Chrome do following
Go to Settings
Clear browsing data
Check all marks
Obliterate the past hour or day, depends on when it worked properly.
Click Clear browsing data
For me it worked.

Answer 2

add !important - to override existing css property
Hope it works
media="all"
.widget a {
color: #777;
}
Change this to
media="all"
.widget a {
color: #000!important;//change
}

Answer 3

It could be down to the cache-busting query string which WordPress adds-
Here is a relevant Chromium bug report.
For now, adding this to functions.php in WordPress in order to remove the cache-busting suffix allows me re-enable persistent edits:
function yourthemename_remove_version( $url ) {
return remove_query_arg( 'ver', $url );
}
add_filter( 'style_loader_src', 'yourthemename_remove_version' );
In future, it looks like Persistence 2.0, recommended at the end of the bug report, will be the solution. It can be enabled as a Chrome DevTool experiment now. Notice that Chrome Canary doesn't work in Linux yet.
Source: https://stackoverflow.com/a/42542366