Background rewrites background-position

[ai]

In:

.test1 {
  background: url(/1.png) no-repeat;
  background-size: 85px 85px;
}
.test2 {
  background: url(/2.png) no-repeat;
  background-size: 85px 85px;
}

Out:

.test1{background:url(/1.png)}
.test1,.test2{background-size:85px 85px}
.test2{background:url(/2.png)}

So in out third line background for .test2 rewrites background-size, which was combined for .test1 and .test2.

[kossnocorp]

:+1:

[kossnocorp]

Had the same issue recently.

[drgullin]

no-repeat shouldn't be removed, since it makes sense for the touch devices, when page is zoomed (default value is repeat).

[ArturAralin]

@ai what was expected?

CSSO has combined are common properties

.test1,.test2{background-size:85px 85px} .test1{background:url(/1.png) no-repeat} .test2{background:url(/2.png) no-repeat}

[lahmatiy]

@ArturAralin background-size will be lost in this case, since background resets all background-* properties

[ArturAralin]

@lahmatiy in this case how need to do it? What result i must get?

[lahmatiy]

In this case

.test1{background:url(/1.png) no-repeat}
.test2{background:url(/2.png) no-repeat}
.test1,.test2{background-size:85px 85px}

[ArturAralin]

Therefore partial overrides must be declared after common declarations?

[geekdevs]

I also get odd results with transparent background:

.cls {
    background: transparent;
    background-position: 50% 0;
}

results in:

.cls{background:0 0;background-position:50% 0}

[lahmatiy]

@geekdevs It's correct. transparent = none = 0 0. 0 0 is the shortest correct background value that set defaults.

[geekdevs]

The problem is that here I only set color, but position is changed instead. See better example why this is an issue below:

.cls1 {
    background: transparent;
    background-position: 50% 0;
}

.cls2 {
    background: #ccc;
    background-position: 50% 0;
}

becomes

.cls1,.cls2{background-position:50% 0}.cls1{background:0 0}.cls2{background:#ccc}

So in origin css position will rendered as background-position:50% 0, on compiled version it will be background-position:0 0

[lahmatiy]

Even if background stay transparent position will be 0 0. The problem here is wrong order but not a transparent -> 0 0 converting.

[geekdevs]

yes, correct. This is what my whole point is about (it does not "merge" background-position with background correctly)