title: Trouble naming children of BEM modifiers
body: <p>So I have the following BEM classes:</p>
  
  <pre><code>.block
  .block--modified
  .block__child
  </code></pre>
  
  <p>Now from what I have seen most people would name the child of the modified <code>.block</code> like so:</p>
  
  <pre><code>.block--modified__child
  </code></pre>
  
  <p>Which I get that makes sense, but is there a reason you could not name it like this:</p>
  
  <pre><code>.block__child--modified
  </code></pre>
  
  <p>I think this looks better and keeps the modification more isolated / explicit, I also like this because then you can have multiple modified children that are not dependant on the parent being modified i.e</p>
  
  <p>We can have a <code>.block</code> and <code>.block .block--modified</code> elements.</p>
  
  <p>And both can have <code>.block__child</code> and <code>.block__child--modified</code> which still follows the naming convention but makes the child elements (modified or not) more flexible.</p>
  
  <p>For a better example say I have the following classes:</p>
  
  <pre><code>.alert
  .alert--warning
  .alert--urgent
  
  .alert__call-to-action
  .alert__call-to-action--warning
  </code></pre>
  
  <p>And I want to layout my HTML as follows:</p>
  
  <pre><code>&lt;div class="alert"&gt;
      &lt;button class="alert__call-to-action"&gt;
          Action! (No Modifier)
      &lt;/button&gt;
  &lt;/div&gt;
  
  &lt;div class="alert alert-warning"&gt;
      &lt;button class="alert__call-to-action alert__call-to-action--warning"&gt;
          Action! (Warning Modifier)
      &lt;/button&gt;
  &lt;/div&gt;
  
  &lt;div class="alert alert-urgent"&gt;
      &lt;button class="alert__call-to-action alert__call-to-action--warning"&gt;
          Action! (Warning Modifier)
      &lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>So you will see I want to re-use the <code>.alert__call-to-action--warning</code> modifier twice in the <code>.alert--warning</code> and <code>.alert--urgent</code> because for what ever reason the styling is the same. Does this make sense from what I can see it makes the modifiers much more usable?</p>
  
  <p>Is there a reason we don't do this? Sorry if there is a better place to post about this please let me know.</p>