положение: фиксированные ячейки таблицы растягиваются по всему экрану

Question

У меня есть таблица на моем сайте. Когда я добавляю position:fixed к таблице, ячейки таблицы внезапно растягиваются по всей высоте страницы, даже если они имеют заданную высоту. как вы можете видеть в приведенном ниже коде, каждый tr имеет заданное значение высоты, но он игнорируется, когда я добавляю position:fixed к таблице, и вместо этого ячейки получают высоту всей страницы и не позволяют мне получить доступ к содержание сайта. любая помощь в том, как это исправить, при этом сохраняя атрибут position:fixed, приветствуется.

.center {
            margin:0 auto;
        }
        a{
            text-decoration:none;
            color:red;
        }
        table{
            text-align:center;
            width:30%;
            left:25%;
            
            /*font-size:larger;*/
        }
        
        body{
            background-color:midnightblue;
            color:snow;
            white-space:nowrap;
        }
        .Error{
            color:red;
        }

        .divSargel{
            width:initial;
            background-color:snow;
            border: solid;
    border-color: #000080;
    float: left;
    margin-left: 0.3%;
    color: red;
    font-size:x-large;
    font-family:monospace;
    border-radius: 20px;
    text-align: center;
    width:100%;
        }
        .divSargel:hover {
        background-color: blue;
        transition: linear 0.5s;
        
    }

<table id="navbar"  border="1" style="right:0px;left:0px;border-style: solid;border-color:black;margin:0 auto;max-width:999999px; width:100%; height: 100%; background-image: none;">
            
            <tr>
                
                <td colspan="5" style="background-image: url('/Pics/videogames2.jpg'); height:100px; background-repeat: no-repeat; background-size:100% 100%">
                    
                </td>
                
            </tr>
            <tr style="height:50px">
                <td style="border-color: #000000; background-color: #000000; color: #FFFFFF;">
                    <asp:TextBox ID="txtClock" style="text-align:center" runat="server" width="90%" ReadOnly="true"></asp:TextBox>
                    </td>
                <td style="border-color: #000000; color: #FFFFFF; background-color: #000000">
                    <asp:TextBox ID="txtPeopleCount" style="text-align:center" runat="server" Width="90%" ReadOnly="true"></asp:TextBox>
                    
                </td>
                <td style="width:50%;border:medium solid #000080; background-color: #000000;">
                    <table border="1" style="border-color:snow;width:100%">
        <%if (Session["UserName"] == null)
                                { %>                
                             
        
                        <tr>
                            <td class="textCenter">
                                <a href="Main.aspx" class="divSargel">
                                Main
                                </a>
                            </td>
                            
                            <td class="textCenter">
                                <a href="ShopProducts.aspx" class="divSargel">
                                Shop
                                </a>
                            </td>
                            
                            
                        </tr>
                        
<%} %>

        
        <%if (Session["UserName"] != null && Session["UserAdmin"] == null)
                                { %>    
                            
                             
                        <tr>
                            <td class="textCenter">
                                <a href="Main.aspx" class="divSargel">
                                Main
                                </a>
                            </td>
                            <td class="textCenter" >
                                <a href="ShowUsers.aspx" class="divSargel">
                                Show Users
                                </a>
                            </td>
                            <td class="textCenter">
                                <a href="ShopProducts.aspx" class="divSargel">
                                Shop
                                </a>
                            </td>
                               
                            
                            <td class="textCenter">
                                <a href="ShoppingCart.aspx" class="divSargel">
                                View Cart
                                </a>
                            </td> 
                                
                            
                            
                        </tr>
                        <tr>
                            <td class="textCenter">
                                <a href="ShowBank.aspx" class="divSargel">
                                View Bank
                                </a>
                            </td>
                            
                                            
                            <td class="textCenter">
                                <a href="ShowCreditCards.aspx" class="divSargel">
                                View credit cards
                                </a>
                            </td> 
                            
                            
                                          
                            <td class="textCenter">
                                <a href="ShowOrders.aspx" class="divSargel">
                                View Orders
                                </a>
                            </td> 
                            
                            <td class="textCenter">
                                <a href="ContactUs.aspx" class="divSargel">
                                Contact us
                                </a>
                            </td> 
                        </tr>
<%} %>
        
        <%if (Session["UserAdmin"] != null)
                                { %>                
                             
                        <tr>
                            <td class="textCenter">
                                <a href="Main.aspx" class="divSargel">
                                Main
                                </a>
                            </td>
                            <td class="textCenter" >
                                <a href="ShowUsers.aspx" class="divSargel">
                                Show Users
                                </a>
                            </td>
                            <td class="textCenter">
                                <a href="ShopProducts.aspx" class="divSargel">
                                Shop
                                </a>
                            </td>
                                
                            
                            <td class="textCenter">
                                <a href="ShoppingCart.aspx" class="divSargel">
                                View Cart
                                </a>
                            </td> 
                                
                            
                             
                        </tr>
                        <tr>
                            
                            <td class="textCenter">
                                <a href="ShowBank.aspx" class="divSargel">
                                View Bank
                                </a>
                            </td>
                                          
                            <td class="textCenter">
                                <a href="ShowCreditCards.aspx" class="divSargel">
                                View credit cards
                                </a>
                            </td> 
                            
                            
                                         
                            <td class="textCenter">
                                <a href="ShowOrders.aspx" class="divSargel">
                                View Orders
                                </a>
                            </td> 
                                           
                            <td class="textCenter">
                                <a href="AdminPage.aspx" class="divSargel">
                                Admin actions
                                </a>
                            </td> 
                                            
                            
                        </tr>
                    
        <%} %></table>
                </td>
                 <%if (Session["UserName"] == null)
        { %>

Answer 1

удалось найти проблему. по какой-то причине у меня была высота: 100% на самой таблице, и поэтому, даже если строки имели заданную высоту, при добавлении позиции: фиксированная таблица растягивалась по экрану.

Answer 2

Попробуйте установить height таблицы по желанию и пометьте ее как важную, например

table{
 height : 150px !important;
}