title: How to hide checkbox title using CSS
body: <p>As you can see in the image below, the table contents are so long and the last <code>td</code> content is hideous. (Sorry for local language, but trust me, the content is not important.)</p>
  
  <p><a href="https://i.stack.imgur.com/OFj8M.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/OFj8M.png" alt="the last td is hideous"></a></p>
  
  <p>What I want is hide checkbox titles using only CSS. It's very hard to not output title 'cause it's rendered automatically by a well-encapsulated module. And I don't want to tamper with it. I was successful to add <code>hide-title</code> class to <code>input</code> itself as follows:</p>
  
  <p><a href="https://i.stack.imgur.com/PxSBy.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/PxSBy.png" alt="input has hide-title class"></a></p>
  
  <p>Is it possible to hide checkbox text only using this advantage? </p>
  
  <p>Following is my html:</p>
  
  <pre><code>&lt;td id="result_box__is_duplex--0"&gt;
      &lt;div class="checkbox-inline"&gt;
          &lt;div class="checkbox"&gt;                                        
              &lt;label&gt;
                  &lt;input type="checkbox" class="hide-title" id="form_product_classes_0_is_duplex" name="form[product_classes][0][is_duplex]" value="1"&gt; 
                  両面印刷可能 &lt;!-- Hide this text with custom class --&gt;
              &lt;/label&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>and each <code>td</code>has an id starting with <code>result_box__is_duplex</code>. I believe the template uses <code>Bootstrap</code> v3.0. Thank you for paying attention.</p>