CODEWITHSUNDEEP
htmlcsstwitter-bootstrap-4
timbo
timbo

Reputation: 14374

Vertical cell alignment with Bootstrap 4

I'm creating an admin page that queries then reports on the page weights of key pages for a site (landing, etc.)

As Bootstrap 4 is close, I have used it to create a layout, which I'm happy with. However for each row, the text in a cell is not vertically aligned. I can do a simple right alignment with:

.cell { text-align: right; }

but I want to vertically align as well. I believe that Bootstrap 4 is using flexbox. Is there some way to do vertical text alignment in a cell using flex? My example is here on CodePen

Upvotes: 0

Views: 405

Answers (1)

Nirpendra Patel
Nirpendra Patel

Reputation: 679

They are already aligned , it's padding inside button that's making text non-aligned on second column w.r.t. first.

add follwing css to second column text :

padding: .375rem 0;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
vertical-align: middle;

Upvotes: 1

Related Questions