Why is the sticky position for the header of the table is not working?

<html><head>
  <title>LFL - Learning for Life</title>
  <link rel="shortcut icon" href="res/lfl_logo.ico">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="google-signin-client_id" content="566798297506-0gu550a900bm8dqu5akrd1dof2gj3db9.apps.googleusercontent.com">
  <link type="text/css" href="index.css?v=70" rel="stylesheet">
<style>.abcRioButton{border-radius:1px;box-shadow:0 2px 4px 0 rgba(0,0,0,.25);-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:background-color .218s,border-color .218s,box-shadow .218s;transition:background-color .218s,border-color .218s,box-shadow .218s;-webkit-user-select:none;-webkit-appearance:none;background-color:#fff;background-image:none;color:#262626;cursor:pointer;outline:none;overflow:hidden;position:relative;text-align:center;vertical-align:middle;white-space:nowrap;width:auto}.abcRioButton:hover{box-shadow:0 0 3px 3px rgba(66,133,244,.3)}.abcRioButtonBlue{background-color:#4285f4;border:none;color:#fff}.abcRioButtonBlue:hover{background-color:#4285f4}.abcRioButtonBlue:active{background-color:#3367d6}.abcRioButtonLightBlue{background-color:#fff;color:#757575}.abcRioButtonLightBlue:active{background-color:#eee;color:#6d6d6d}.abcRioButtonIcon{float:left}.abcRioButtonBlue .abcRioButtonIcon{background-color:#fff;border-radius:1px}.abcRioButtonSvg{display:block}.abcRioButtonContents{font-family:Roboto,arial,sans-serif;font-size:14px;font-weight:500;letter-spacing:.21px;margin-left:6px;margin-right:6px;vertical-align:top}.abcRioButtonContentWrapper{height:100%;width:100%}.abcRioButtonBlue .abcRioButtonContentWrapper{border:1px solid transparent}.abcRioButtonErrorWrapper,.abcRioButtonWorkingWrapper{display:none;height:100%;width:100%}.abcRioButtonErrorIcon,.abcRioButtonWorkingIcon{margin-left:auto;margin-right:auto}.abcRioButtonErrorState,.abcRioButtonWorkingState{border:1px solid #d5d5d5;border:1px solid rgba(0,0,0,.17);box-shadow:0 1px 0 rgba(0,0,0,.05);color:#262626}.abcRioButtonErrorState:hover,.abcRioButtonWorkingState:hover{border:1px solid #aaa;border:1px solid rgba(0,0,0,.25);box-shadow:0 1px 0 rgba(0,0,0,.1)}.abcRioButtonErrorState:active,.abcRioButtonWorkingState:active{border:1px solid #aaa;border:1px solid rgba(0,0,0,.25);box-shadow:inset 0 1px 0 #ddd;color:#262626}.abcRioButtonWorkingState,.abcRioButtonWorkingState:hover{background-color:#f5f5f5}.abcRioButtonWorkingState:active{background-color:#e5e5e5}.abcRioButtonErrorState,.abcRioButtonErrorState:hover{background-color:#fff}.abcRioButtonErrorState:active{background-color:#e5e5e5}.abcRioButtonErrorState .abcRioButtonErrorWrapper,.abcRioButtonWorkingState .abcRioButtonWorkingWrapper{display:block}.abcRioButtonErrorState .abcRioButtonContentWrapper,.abcRioButtonErrorState .abcRioButtonWorkingWrapper,.abcRioButtonWorkingState .abcRioButtonContentWrapper{display:none} .-webkit-keyframes abcRioButtonWorkingIconPathSpinKeyframes {0% {-webkit-transform: rotate(0deg)}}</style></head>
<body>
<div id="above"></div>
<div id="root">
  <div id="header" class="header"><div id="pid"><table style="width:100%;"><tbody><tr><td><a onclick="go_home()"><svg width="24px" height="24px" viewBox="0 0 512 512" version="1.1" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path class="st0" d="M217,129.88c-6.25-6.25-16.38-6.25-22.63,0L79.61,244.64c0.39,0.39-0.76,0.8-1.11,1.23 c-0.11,0.13-0.2,0.27-0.31,0.41c-0.21,0.28-0.42,0.55-0.62,0.84c-0.14,0.21-0.26,0.43-0.39,0.64c-0.14,0.23-0.28,0.46-0.41,0.7 c-0.13,0.24-0.24,0.48-0.35,0.73c-0.11,0.23-0.22,0.45-0.32,0.68c-0.11,0.26-0.19,0.52-0.28,0.78c-0.08,0.23-0.17,0.46-0.24,0.69 c-0.09,0.29-0.15,0.58-0.22,0.86c-0.05,0.22-0.11,0.43-0.16,0.65c-0.08,0.38-0.13,0.76-0.17,1.14c-0.02,0.14-0.04,0.27-0.06,0.41 c-0.11,1.07-0.11,2.15,0,3.22c0.01,0.06,0.02,0.12,0.03,0.18c0.05,0.46,0.12,0.92,0.21,1.37c0.03,0.13,0.07,0.26,0.1,0.39 c0.09,0.38,0.18,0.76,0.29,1.13c0.04,0.13,0.09,0.26,0.14,0.4c0.12,0.36,0.25,0.73,0.4,1.09c0.05,0.11,0.1,0.21,0.15,0.32 c0.17,0.37,0.34,0.74,0.53,1.1c0.04,0.07,0.09,0.14,0.13,0.21c0.21,0.38,0.44,0.76,0.68,1.13c0.02,0.03,0.04,0.06,0.06,0.09 c0.55,0.81,1.18,1.58,1.89,2.29l114.81,114.81c3.12,3.12,7.22,4.69,11.31,4.69s8.19-1.56,11.31-4.69c6.25-6.25,6.25-16.38,0-22.63 l-87.5-87.5h291.62c8.84,0,16-7.16,16-16s-7.16-16-16-16H129.51L217,152.5C223.25,146.26,223.25,136.13,217,129.88z"></path></svg></a> Food List</td><td style="padding:0 8px 12px 4px;text-align:right;"><div id="tdt" onclick="show_menu(event,[1])"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="6 0 12 24" width="12px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"></path></svg></div></td></tr></tbody></table></div></div>
  <div id="body" class="body"><input id="srch" class="search_inp" autocomplete="off" placeholder="Search گـــــه‌ڕان" onkeyup="get_food_list(1)"><br><input type="checkbox" id="cb0" checked="" value="0" onchange="toggle_checkboxes(event)"><label for="cb0">All</label> <input type="checkbox" id="cb1" checked="" value="1" onchange="get_food_list(2)"><label for="cb1">Vegetable</label> <input type="checkbox" id="cb2" checked="" value="2" onchange="get_food_list(2)"><label for="cb2">Legume</label> <input type="checkbox" id="cb3" checked="" value="3" onchange="get_food_list(2)"><label for="cb3">Nuts and seeds</label> <input type="checkbox" id="cb4" checked="" value="4" onchange="get_food_list(2)"><label for="cb4">Dairy</label> <input type="checkbox" id="cb5" checked="" value="5" onchange="get_food_list(2)"><label for="cb5">Fruit</label> <input type="checkbox" id="cb6" checked="" value="6" onchange="get_food_list(2)"><label for="cb6">Meat</label> <input type="checkbox" id="cb7" checked="" value="7" onchange="get_food_list(2)"><label for="cb7">Oil</label> <input type="checkbox" id="cb8" checked="" value="8" onchange="get_food_list(2)"><label for="cb8">Seasoning</label> <input type="checkbox" id="cb9" checked="" value="9" onchange="get_food_list(2)"><label for="cb9">Grain</label> <table id="sortableTable" class="fl">
    <thead>
    <tr>
    <th>#</th>
    <th>English</th>
    <th>عربي</th>
    <th>کوردى</th>
    <th>Cal</th>
    <th>Water</th>
    <th>Carb</th>
    <th>Sugar</th>
    <th>Fat</th>
    <th>Prot</th>
    <th>Fiber</th>
    <th>Glyc</th>
    <th>Chol</th>
    <th>Sodium</th>
    <th>Nutri</th>
    <th>Nova</th>
    </tr>
    </thead>
    <tbody id="flb"><tr>
        <td class="rt" <a="" onclick="copy_edit_food('Bean')">1</td>
        <td><i></i>B<i></i>e<i></i>a<i></i>n<i></i></td>
        <td class="rt"><i></i>ف<i></i>ا<i></i>ص<i></i>و<i></i>ل<i></i>ي<i></i>ا<i></i></td>
        <td class="rt"><i></i>پ<i></i>ا<i></i>ق<i></i>ل<i></i>ه<i></i>‌<i></i></td>
        <td class="rt">341</td>
        <td class="rt">11.0</td>
        <td class="rt">33.3</td>
        <td class="rt">5.7</td>
        <td class="rt">1.5</td>
        <td class="rt">26.1</td>
        <td class="rt">25.0</td>
        <td class="rt">24</td>
        <td class="rt">0</td>
        <td class="rt">13</td>
        <td>A</td>
        <td class="rt">1</td>
        </tr><tr>
        <td class="rt" <a="" onclick="copy_edit_food('Chickpea')">2</td>
        <td><i></i>C<i></i>h<i></i>i<i></i>c<i></i>k<i></i>p<i></i>e<i></i>a<i></i></td>
        <td class="rt"><i></i>ح<i></i>م<i></i>ص<i></i></td>
        <td class="rt"><i></i>ن<i></i>ۆ<i></i>ك<i></i></td>
        <td class="rt">364</td>
        <td class="rt">11.5</td>
        <td class="rt">43.3</td>
        <td class="rt">10.7</td>
        <td class="rt">6.0</td>
        <td class="rt">19.3</td>
        <td class="rt">17.4</td>
        <td class="rt">28</td>
        <td class="rt">0</td>
        <td class="rt">24</td>
        <td>A</td>
        <td class="rt">1</td>
        </tr><tr>
        <td class="rt" <a="" onclick="copy_edit_food('Lentil')">3</td>
        <td><i></i>L<i></i>e<i></i>n<i></i>t<i></i>i<i></i>l<i></i></td>
        <td class="rt"><i></i>ع<i></i>د<i></i>س<i></i></td>
        <td class="rt"><i></i>ن<i></i>ی<i></i>س<i></i>ك<i></i></td>
        <td class="rt">353</td>
        <td class="rt">10.4</td>
        <td class="rt">29.6</td>
        <td class="rt">2.0</td>
        <td class="rt">1.1</td>
        <td class="rt">25.8</td>
        <td class="rt">30.5</td>
        <td class="rt">32</td>
        <td class="rt">0</td>
        <td class="rt">6</td>
        <td>A</td>
        <td class="rt">1</td>
        </tr></tbody></table><br><li><a href="https://www.google.com/search?q=Glycemic+Index" target="_blank">Glyc: Glycemic Index</a></li><li><a href="https://www.google.com/search?q=Nutri+Score" target="_blank">Nutri: Nutri Score</a></li><li><a href="https://www.google.com/search?q=Nova+Classification" target="_blank">Nova: Nova Classification</a></li><li><a href="https://world.openfoodfacts.org" target="_blank">Open Food Facts</a></li><br></div>
  <div id="footer"></div>
</div>
<div id="below"></div>
<div id="signin" class="g-signin2" data-onsuccess="onSignIn" data-gapiscan="true" data-onload="true" style="display: none;"><div style="height:36px;width:120px;" class="abcRioButton abcRioButtonLightBlue"><div class="abcRioButtonContentWrapper"><div class="abcRioButtonIcon" style="padding:8px"><div style="width:18px;height:18px;" class="abcRioButtonSvgImageWithFallback abcRioButtonIconImage abcRioButtonIconImage18"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="18px" height="18px" viewBox="0 0 48 48" class="abcRioButtonSvg"><g><path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"></path><path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"></path><path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"></path><path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"></path><path fill="none" d="M0 0h48v48H0z"></path></g></svg></div></div><span style="font-size:13px;line-height:34px;" class="abcRioButtonContents"><span id="not_signed_in65fyufom9q8p">Sign in</span><span id="connected65fyufom9q8p" style="display:none">Signed in</span></span></div></div></div>
<div id="bottom"></div>
<div id="info" class="info"></div>
<script src="https://apis.google.com/_/scs/abc-static/_/js/k=gapi.lb.en.nJpyt-fjzo8.O/m=signin2/rt=j/sv=1/d=1/ed=1/rs=AHpOoo9fTqXSCmwMDsu9FH68l5KSqr6MBg/cb=gapi.loaded_0?le=scs" async=""></script><script type="text/javascript" src="index.js?v=232"></script>
<script src="https://apis.google.com/js/platform.js" async="" defer="" gapi_processed="true"></script>


<iframe id="ssIFrame_google" sandbox="allow-scripts allow-same-origin" allow="identity-credentials-get" aria-hidden="true" frame-border="0" style="position: absolute; width: 1px; height: 1px; inset: -9999px; display: none;" src="https://accounts.google.com/o/oauth2/iframe#origin=http%3A%2F%2F192.168.1.14&amp;rpcToken=284612037.87099075"></iframe></body></html>