title: Style input placeholder with Sass for focused fields
body: <p>I'm trying to style placeholders for input fields (for different browsers) in Sass 3.3.1, and want to change the opacity when the field is focused. I'm having a hard time combining the pseudo-class and pseudo-elements with the ampersand. The following gives a compilation error:</p>
  
  <pre><code>::-webkit-input-placeholder,
  :-moz-placeholder,
  ::-moz-placeholder,
  :-ms-input-placeholder{
  
      ... some default styling
  
      :focus#{&amp;}{
          opacity: 0;
      }
  }
  </code></pre>
  
  <p>Can this be done?</p>
  
  <h2>Edit</h2>
  
  <p>This is the output I am looking for:</p>
  
  <pre><code>::-webkit-input-placeholder {
      opacity: 1;
  }
  :-moz-placeholder{
      opacity: 1;
  }
  ::-moz-placeholder{
      opacity: 1;
  }
  :-ms-input-placeholder{
      opacity: 1;
  }
  :focus::-webkit-input-placeholder {
      opacity: 0;
  }
  :focus:-moz-placeholder{
      opacity: 0;
  }
  :focus::-moz-placeholder{
      opacity: 0;
  }
  :focus:-ms-input-placeholder{
      opacity: 0;
  } 
  </code></pre>