background-size() mixin and multiple background ?

[johnraz]

Not sure if it's a missing feature or just me missing something here, but is there a way to assign multiple values to the background-size() mixin in order to target multiple backgrounds ?

I would like it to output:

-webkit-background-size: 50% 50%, 100% 100%;
-moz-background-size: 50% 50%, 100% 100%;
background-size: 50% 50%, 100% 100%;

[petrbrzek]

Hey, it's not missing feature. It works just fine.

.background-size(50% 50%, 100% 100%, cover);
// output:
-webkit-background-size: 50% 50%, 100% 100%, cover;
-moz-background-size: 50% 50%, 100% 100%, cover;
background-size: 50% 50%, 100% 100%, cover;

[johnraz]

I can confirm it is indeed working - must have been doing something silly. Thanks for the feedback and sorry for wasting your time ;-)

[GlassGruber]

Unfortunately, I'm having still problems with this. The properties are passed, but no comma is inserted!

With a case like

.lh-background-size(cover, 60%);

I'm getting back compiled

  -webkit-background-size: cover 60%;
  -moz-background-size: cover 60%;
  background-size: cover 60%;

As you can see I'm using the prefixed version (for bootstrap conflicts), and I'm using the Prepros app for compiling with 'strict math' and 'strict unit' option checked (I've already tryed with the above option disabled too).

Any info on this? Thanks a lot and awesome library btw! ;)

[GlassGruber]

Lately I've been in the need to use this mixin and again faced the same problem. Tinkering around, I found a fix for this, but it looks quite bad imo. I've tried interpolating the whole parameter string, nothing. Only cover, nothing changed again... until I mistyped and wrote an empty space in the interpoled string like this: .lh-background-size(~"cover ",60%); I compiled without noticing and it worked! Further investigating in this space related thing, I think that the real issue in here is the missing space parsed after cover. Look at the following .lh-background-size(cover~" ",60%); The above string worked too! I don't really know why this happen, but with this the expected result is achieved with no missing commas! Any idea on this?