title: How to animate searchbox length from focusing on the textbox class CSS3?
body: <p>hi there i am currently trying to make a search box(.pullDown) that animates when you :focus on the textbox(.name) and it should change the size of the div below is the code i tried but it only changed the textbox size not the div i wondered if anyone has any advice on how to make it only change the div height i have tried experimenting with nesting classes but could not get the right results</p>
  
  <pre><code>.pullDown{  
      height: 150px ; 
      -webkit-transition: width 1s ease, height 1s ease;  
      -moz-transition: width 1s ease, height 1s ease;  
      -o-transition: width 1s ease, height 1s ease;  
      -ms-transition: width 1s ease, height 1s ease;  
      transition: width 1s ease, height 1s ease; ;
  }
  .name:focus, .pullDown{ 
      display:block;
      height:276px !important; 
  
  }
  </code></pre>
  
  <p>thanks very much for your help
  p.s. i am looking for a css way to do it only if possible </p>