title: js animating block with image inside
body: <p>Have a block with another relative block inside, which has a background in style of parent block (like on a a picture). When i trying to change width of my block, relative block disappears. </p>
  
  <p><a href="http://storage1.static.itmages.ru/i/12/0828/h_1346148569_9296399_c500fa8e0e.png" rel="nofollow">picture</a></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  
  &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;&lt;/title&gt;
  &lt;meta http-equiv="content-type" content="text/html; charset=UTF-8"&gt;
  
  &lt;style&gt;
   #button
  {
      width: 195px ;
      height: 60px;
      display: inline-block;
      position: relative;
      background: url('/res/bg.png') repeat-x;
  }
  #button div#arrow
  {
      background: url('/res/Arrow.png') no-repeat;
      width: 30px;
      height: 60px;
      display: block;
      position: absolute;
      top:0px;
      right: -30px;
  }
  
  
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;div id='button'&gt;
  &lt;div id='arrow'&gt;&lt;/div&gt; 
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Forgot about the code of animating:
  $('#button').animate({width:'-=120px'}, 2000)</p>