Aligning text “on-the-line” e.g. top, bottom middle

Question

Not sure what you actually call the line text is aligned to...

As you can see the aqua colored '100' there has it's top aligned with 'BRANCH', but I'd like it to align it's bottom with 'BRANCH'. I tried to illustrate that with my image here and the pink overlay.

<div class="row">
                                <div class="col-md-4">
                                    <h1 class="number">100</h1>
                                </div>
                                <div class="col-md-8">
                                    <h2 class="description">Branch</h2>
                                </div>
                            </div>

How would I achieve this with CSS?

Answer 1

{vertical-align:baseline}

UPDATE

since you are using 2 divs, you can just do this...

div.col-md-4, div.col-md-8 {
display: inline-block;
vertical-align:bottom;
}