React Bootstrap: Vertical alignment of row's columns?
You can apply any of Bootstrap's classes to a React Bootstrap component. So, per the Grid System docs, the following columns will both be centered vertically:
<Row className="align-items-center">
<Col>
<h1>{title}</h1>
<p>{details}</p>
</Col>
<Col>
<button>{callToAction}</button>
</Col>
</Row>;
If you are using table rows, you can wrap contents within a <div>..</div>
like:
<tr>
<div classname="align-me"></div>
</tr>
and then you can use flexbox to align them dynamically:
tr .align-me {
display: flex;
align-items: center;
}