I have DOM like this
<div class="outer">
  <div class="inner">
  </div>
</div>
and corresponding CSS is like
.outer {
   width: 700px;
}
, where inner could by typeA, typeB.....
Later I found that I want to enlarge outer when particular typeX show up, but
.outer .typeX {
   width: 90%;
}
will apply style width: 90% to .typeX div not .outer div. How do I solve this? Is it possible in pure CSS? (Assume .outer is fixed since it is generated by other library)
 
    