Mixin for Group Pseudo Classes with SASS

Asked Mar 14 '14 at 18:35

Active Mar 14 '14 at 18:35

Viewed 343 times

Ideally I want to create a mixin to style all the placeholder pseudo classes. I'm not sure if this is even possible. Here's what I have:

@mixin placeholder($color) {
  ::-webkit-input-placeholder{
    color: $color;
  }
  :-moz-placeholder {
    color: $color;
  }
  ::-moz-placeholder {
    color: $color;
  }
  :-ms-input-placeholder {
    color: $color;
  }
}

Which ideally would be used like this:

input {
    &@placeholder(red);
}

And would result in this CSS:

  input::-webkit-input-placeholder{
    color: red;
  }
  input:-moz-placeholder {
    color: red;
  }

asked Mar 14 '14 at 18:35

Elijah Murray

2,132
5
30
43

why not use @content? – agconti Mar 14 '14 at 18:37
possible duplicate of [Placeholder Mixin SCSS/CSS](http://stackoverflow.com/questions/17181849/placeholder-mixin-scss-css) – cimmanon Mar 14 '14 at 18:39
@agconti What is `@content`? cimmanon, it's not quite the same because I don't want to apply it site wide. – Elijah Murray Mar 14 '14 at 19:05
1

There's more than one answer there, try reading the entire page. – cimmanon Mar 14 '14 at 19:06

Mixin for Group Pseudo Classes with SASS

0 Answers0