Frage

Here is my Less code:

i.icon-gps {
  .sprite(@icon-gps);
  display:inline-block;
}
i.icon-home {
  .sprite(@icon-home);
  display:inline-block;
}
i.icon-map {
  .sprite(@icon-map);
  display:inline-block;
}
//and many more

Is it possible to write it in one expression?

War es hilfreich?

Lösung

If the usage is <i class="icon-gps" ></i>

i.icon
{
    &-gps {
      .sprite(@icon-gps);
      display:inline-block;
    }
    &-home {
      .sprite(@icon-home);
      display:inline-block;
    }
    &-map {
      .sprite(@icon-map);
      display:inline-block;
    }
}

If the usage is <i class="icon icon-gps"></i> (thanks to @Curt's comment)

i.icon
{
    display:inline-block;
    &-gps {
      .sprite(@icon-gps);
    }
    &-home {
      .sprite(@icon-home);
    }
    &-map {
      .sprite(@icon-map);
    }
}
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top