Figuring this out shouldn't be too hard, but for some reason, it's making me go crazy :D I've got a basic button (just for testing purposes) that looks like this:
.btn-test {
height: 100px;
}
<button class="btn btn-test">
<span>This is a test</span>
</button>
If you're using bootstrap and run this code, you'll notice that the text "This is a test" is vertically aligned. I've checked the button's CSS properties, but can't seem to find where this alignment is set. My guess is it has something to do with flexbox. I've attempted adding align-items-start
to the button classes, but nothing seems to change.
Surely there must be someone out there who knows an easy way to align the text to the top or bottom?