title: ag-grid table: Vertical-align: middle
body: <p>I am using the framework ag-grid ()
  I have changed the row-height to 50px. </p>
  
  <pre><code>&lt;div 
    className="ag-theme-balham"
    style={{ 
      height: '90vh', 
      width: '100%',
      'font-size': '18px',
      'row-height': '50px'
      }} 
      &gt;
      &lt;AgGridReact        
          rowHeight={50}
          columnDefs={columnsTaenze}
          rowSelection={'multiple'}
          onFirstDataRendered={this.autoSizeAll}
          rowDragManaged={true}
          enableColResize={true}
          animateRows={true}
          rowData={this.props.tabledata}
          enableFilter={true}
          onRowDragEnd={this.onRowDragEnd}&gt;
      &lt;/AgGridReact&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Sadly, I can not manage to center the cell vertically.</p>
  
  <p>I have tried to change many classes, including <code>ag-cell</code>.
  My css I tried:</p>
  
  <pre><code>.ag-cell{
      line-height: 50px;
      height: 100%;
      vertical-align: middle;
  }
  </code></pre>
  
  <p>But the cell isn`t centered:
  <a href="https://i.stack.imgur.com/HI2cX.png" rel="noreferrer"><img src="https://i.stack.imgur.com/HI2cX.png" alt="enter image description here"></a></p>