Vahe
Vahe

Reputation: 1841

CSS/Bootstrap/HTML - How do I make a div 100% height of parent container regardless of zoom?

I want to make an inner div 100% height of the rendered parent div regardless of zoom.

My jsfiddle shows that the shadow div is not the full height as the parent div when I zoom in. How do I cover the parent div completely?

HTML

<div class="container account-settings-confirm-container ng-scope">
<div class="spotlight"></div>
  <div class="account-settings-confirm">
        <div class="row account-settings-confirm-banner extend-full">
          <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4 col-xs-4 text-left banner-user">

      <div class="account-settings-confirm-header row">

      <div class="account-settings-confirm-body">
        <div class="table-responsive">
          <table class="table account-settings-confirm-table-products">
            <thead>
              <tr>
                <th>h1</th>
                <th>h1</th>
                <th>h1</th>
                <th>h1</th>
                <th>h1</th>
                <th>h1</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                  <td colspan="6">
                    <div class="account-settings-confirm-table-container text-center">
                        button theader <br>
                        <button id="SetUpStore" class="btn-regular-wide">Button</button>
                    </div>
                  </td>
              </tr>
            </tbody>
          </table>
        </div>
</div>
</div></div>

jsfiddle https://jsfiddle.net/10nmL3vv/5/

full screen https://jsfiddle.net/10nmL3vv/5/embedded/result

Upvotes: 1

Views: 242

Answers (1)

rmarif
rmarif

Reputation: 548

you can use .height() jQuery for this purpose. for more related methods you can read this. http://www.w3schools.com/jquery/css_height.asp

Upvotes: 1

Related Questions