React Bootstrap: Vertical alignment of row's columns?

Question

I am using react bootstrap, I am trying to align items vertically within a row but with no luck. My problem is I have a button in one of the columns, so for the other column

Answer 1

Simple solutions.

Two classes should be used in immediate parent div/element. d-flex and align-items-center

import { Col, Container, Row } from 'react-bootstrap';




   
      
         

            

                
{items.length}
                
{items.name}
            
          
      
   

N.B. - styled has been optionally used to see the effect. items of items.length is a destructuring array from useState() hook