Не удается отрегулировать высоту тела таблицы для прокрутки переполнения - PullRequest
1 голос
/ 11 марта 2020

Это может звучать как нубский вопрос, но я не могу на всю жизнь изменить высоту тела моего стола. Я хочу, чтобы он мог прокручиваться с помощью свойства overflow-y, но я не могу настроить высоту таблицы, даже после присвоения свойству height определенного значения.

Вот мой css для моей таблицы

#itemstable {
    border-collapse: collapse;
    width: 100%;
  }

  #itemstable td {
    max-width: 115px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 1px solid #f7f5e6;
    padding: 8px;
  }

  #itemstable table {border: 2px solid var(--Blue)}

  #itemstable tr:nth-child(even){background-color: var(--LightBlue);}
  #itemstable tr:nth-child(odd){background-color: var(--LighterBlue);}

  #itemstable tbody tr:hover {
      background-color: var(--AccentBlue); 
      color: white;
      cursor: pointer;
    }


  #itemstable th {
    padding: 4px;
    text-align: center;
    background-color: var(--Blue);
    color: white;
  }

.InvTable{
    height: 100%;
    width: 1300px;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    table-layout: fixed;
}

.InvTable .TableHeaderContainer {
    border: 2px solid var(--Blue);
    background-color: var(--Blue);
    color: white;
    text-align: center;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
}

А вот мой html

<div>
   <div className="InvTable">
      <table id="itemstable" style={{border: '2px solid #333a56'}}>
         <thead>
            <tr>
              <th>Vendor</th>
              <th>P.O #</th>
              <th>Status</th> 
             </tr>
          </thead>
          <tbody>
             {this.RenderTableBody()}
          </tbody>
        </table>
      </div>
    </div>

Я попытался установить высоту каждой из моих переменных css, но ничего не изменилось, таблица остается той же высоты. Если бы кто-нибудь мог помочь мне понять, почему я не могу изменить высоту своего стола, это было бы здорово! Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...