Copying CSS from devtools copies spaces

Question

My workflow for CSS often includes that I tingle around in devtools, add/change CSS in the browser and when the values fit my needs I copy the CSS and paste it in my .scss-file.

Now since a while my copied CSS includes spaces for formatting.

CSS in Chrome

div {
    width: 100%;
    background-color: yellow;
}

Copied Code in Editor

Now when I copy the properties (width & background-color) and paste it in my editor I copy it as follows:

..width: 100%;
..background-color: yellow;

(dots indicate spaces)

Is there a way to copy the CSS without the spaces, like this:

width: 100%;
background-color: yellow;

Every time I paste the CSS it messes up my formatting, I therefor do a lot of unnecessary formatting. (like removing the spaces as I use tabs and not spaces)

I know the spaces were added some months ago, before you could just copy the CSS without spaces.

Answer 1

I was looking for this too and the closest thing I found is at the Chrome developer tools > settings > Sources > Default indentation. Unfortunately there is no option for zero spaces.

Answer 2

It is not possible to copy from styles inspector without these spaces.

One solution is to click on the stylesheet name near the style, open the css in Sources tab, then align the required code to left by pressing Shift+Tab and then copy.