title: How to set the background color of an element in my case
body: <p>I am trying to create a <code>bootstrap accordion</code> for my app. I also have background color in its parent element. My problem is that when I expand my <code>accordions</code>, it extends the height of my page and the background color doesn't cover the extended area. </p>
  
  <p><strong>my html</strong></p>
  
  <pre><code>&lt;div id='wrapper&gt;
  &lt;accordion id='accordion' close-others="false"&gt;
      &lt;accordion-group&gt;
          &lt;accordion-heading &gt;
              &lt;h2 class='title'&gt;Title 1&lt;/h2&gt;
          &lt;/accordion-heading&gt;
          &lt;div id="first" class="panel-collapse collapse in"&gt;
              //contents...
          &lt;/div&gt;
      &lt;/accordion-group&gt;
    //I have 5 to 6 accordion group. 
  &lt;/accordion&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>//I used height:100% and it looks fine when the page first loaded but not after //user //expand all the accordion.
  
  #wrapper{
      background-color: red;
      height: 100%;  
      display: block;
  }
  </code></pre>
  
  <p>Can anyone help me about it? Thanks a lot!</p>