简体   繁体   English

在线对齐文本,例如顶部,底部中间

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

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'. 如您所见,浅绿色的“ 100”的顶部与“ BRANCH”对齐,但是我希望它的底部与“ 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? 如何使用CSS来实现?

{vertical-align:baseline} {垂直对齐:基线}

UPDATE UPDATE

since you are using 2 divs, you can just do this... 由于您使用的是2个div,因此您可以执行此操作...

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM