我如何可以垂直居中一个引导类按钮？ [英] How can I center vertically a bootstrap class button?

问题描述

我需要在 form-actions 中垂直地获取一个按钮：

I need to get a button inside a form-actions vertically:

>

这样绿色按钮被显示到其div（蓝色区域）。我如何得到它的中心。我使用 style.css 文件，其中我已经样式化了一些其他div。

So that green button is being displayed down to its div (the blue area). How can I get to center it. I use a style.css file where I've styled some other divs.

推荐答案

这是你需要的！这是一个演示，请检查并让我知道，如果你需要其他。

Is this what you need! Here is a demo, please check and let me know if you need anything else.

http ：//jsfiddle.net/fkQBf/

<div style="height: 200px; border: solid 2px green; text-align:center;line-height:200px;">
    <input type="submit" Value="Ok" style="vertical-align: middle"></input>
</div>

更新的代码和小提琴：

我们不应该使用内联样式，下面是使用单独样式的更新的小调。

We should not use inline styles, so below is the updated fiddle with separate style

http://jsfiddle.net/fkQBf/1/

<div id="container">
    <input id="verticalButton" type="submit" Value="Ok"></input>
</div>

div#container
{
    height: 200px; 
    border: solid 2px green; text-align:center;
    line-height:200px;
}

input#verticalButton
{
     vertical-align: middle
}

希望这有助于！

这篇关于我如何可以垂直居中一个引导类按钮？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！