title: how do i make an invisible text input box visible on hover?
body: <p>It doesn't seem to work for me!</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code> &lt;div id="box1"&gt;
       &lt;form action=""&gt;
           &lt;input type="string" name="htmlcode" /&gt;
       &lt;/form&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>#box1 {
      width:100px;
      height:100px;
      border-color:black 4px
  }
  input {
      display:none;
  }
  a:hover input{
      display:block;
  }
  </code></pre>
  
  <p>the text input is either invisible, or visible but does not respond to hover</p>