title: Hiding a text when a sections width is set to 0
body: <p>so I've had a bit of a problem with trying to make a section's width to 0 and have everything inside the object do the same thing. Essentially hide the section and everything inside it. Thing is, the section will change to a width of 0px but the text inside still displays and also sort of pushes off to the side. Is there any way that I can use either css or javascript to hide the text and bring it back when the sections width changes back over?</p>
  
  <p>Code pasted into jsfiddle:
  <a href="http://jsfiddle.net/t6ck9ajb/" rel="nofollow">http://jsfiddle.net/t6ck9ajb/</a></p>
  
  <pre><code>$(document).ready(function(){
          $("#about").click(function(){
          if ($("#about-me").css("width") &lt;= "0vw") {
              $("#introduction").animate({width:"0vw"}, 500);
              /*$("#intro").css("display","none");
              $("#port").css("display","none");
              $("#about").css("display","none"); */
          }
          else {
              $("#introduction").animate({width:"0vw"});
          }
          });
          });
  </code></pre>
  
  <p>This is what I have to attempt at hiding the text, but this didn't really hide it.</p>