From 1ec6628e8005b17ecf16b194450874d8e988a45d Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Wed, 1 Feb 2012 23:10:00 -0800
Subject: [PATCH] add note for icon class usage per #1501

---
 docs/assets/bootstrap.zip              | Bin 52356 -> 52356 bytes
 docs/base-css.html                     |   4 ++++
 docs/templates/pages/base-css.mustache |   4 ++++
 3 files changed, 8 insertions(+)

diff --git a/docs/assets/bootstrap.zip b/docs/assets/bootstrap.zip
index 12aef2c013f317c7938bf955a49b98702e83cc32..c1b04c36b4eac385e7e6afa01697daa4fd1bf6b6 100644
GIT binary patch
delta 441
zcmZpf$=ouNnJ2)TnT3l11k`s<<WXdsWv1mn$87S(lfqmu35}f-160{&!zCv6aWDbJ
zX4rzoW}9uieF`Knc{!&eRAloz&Oml1^_`O)1&zQa&NkazDHvk_Qgz+Y45muhX|*m$
z)q#9fBzr-|0|hw>oWX*#%r*xWR0@EE&NSG<g!mh)1wf|tOjN;e+2qR;4PaJqPI|2X
zQul3>3ELc?4}cCa*t}N+WZL`V`b@JxJ{6xFf0_-X$o_;e(`=B4EQmMxgf|lJ{|SE>
z52!c)qyt1RSmlM2E)Y40NkDn~6Ec$nPl?0S07W`a1tRf&pYletJN>i~%zU8TyH497
Q@g&bUF+t*Fa={r902v*qr~m)}

delta 441
zcmZpf$=ouNnJ2)TnT3l11YCDa<WXe%Xrkr+$z<}zlfqm`5&^1gpWqS``#6|@if7n@
z#Xg#BynPBJFnKwrBUIJqcbtLjAR$LVBdCd+D+OZ=Ktk6Y&0s>pPOEi6LI?6yk?e&S
zKbfPz8Ky3<pi%&&?o5L%Oo+d+8Z6W^Q3b<glP^y+fH{P7(rX2f)^D3kU_u6)_lkgo
z-XGUz`Uvu=_~iK0Y#<T)6UIznzsrJnlTUaf@&2FiN8;t5bb#mutGsa11;Zqn$$_WD
mk<@ga3Pj@lKIM(3BmJ}ylKHz%+ad8J&p1JN!jlWmhyVaE>bE}t

diff --git a/docs/base-css.html b/docs/base-css.html
index a198064f8..f6fcda10c 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -1469,6 +1469,10 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
 &lt;i class="icon-search icon-white"&gt;&lt;/i&gt;
 </pre>
       <p>There are 120 classes to choose from for your icons. Just add an <code>&lt;i&gt;</code> tag with the right classes and you're set. You can find the full list in <strong>sprites.less</strong> or right here in this document.</p>
+      <div class="alert alert-info">
+        <strong>Heads up!</strong>
+        The <code>.icon-</code> class must be listed first in the class tag for proper CSS targeting.
+      </div>
     </div>
     <div class="span4">
       <h3>Use cases</h3>
diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index 634809715..892442cee 100644
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -1393,6 +1393,10 @@
 &lt;i class="icon-search icon-white"&gt;&lt;/i&gt;
 </pre>
       <p>{{_i}}There are 120 classes to choose from for your icons. Just add an <code>&lt;i&gt;</code> tag with the right classes and you're set. You can find the full list in <strong>sprites.less</strong> or right here in this document.{{/i}}</p>
+      <div class="alert alert-info">
+        <strong>{{_i}}Heads up!{{/i}}</strong>
+        {{_i}}The <code>.icon-</code> class must be listed first in the class tag for proper CSS targeting.{{/i}}
+      </div>
     </div>
     <div class="span4">
       <h3>{{_i}}Use cases{{/i}}</h3>