html - 在较长的 P 或 DIV 中垂直展开 jQuery 按钮

Question

我已经准备好了a simple jsFiddle demo对于我的问题。

中心对齐的 P 元素中有一组 jQuery 按钮:

<P ALIGN="center">
        <BUTTON ID="recallBtn">Recall</BUTTON>
        <BUTTON ID="shuffleBtn">Shiffle</BUTTON>
        <BUTTON ID="swapBtn">Swap</BUTTON>
        <BUTTON ID="skipBtn">Skip</BUTTON>
        <BUTTON ID="resignBtn">Resign</BUTTON>
        <BUTTON ID="pileBtn" DISABLED>Pile</BUTTON>
        <BUTTON ID="playBtn">Play</BUTTON>
</P>

如您所见，按钮显示为两行，因为段落太长 - 并且按钮在垂直方向上相互接触。

我怎样才能在按钮之间添加一些垂直填充？

我试过添加 <P ALIGN="center" STYLE="line-height: 200%">和类似的东西(行高 2 或 2em，也尝试使用 DIV )——但根本没有视觉变化。

为我的问题提供一些背景信息 - 我的 HTML5 游戏同时嵌入了 Facebook canvas在 Wordpress 网站中，以及 my custom CSS是最小的。

Answer 1

为 .ui-button 类添加边距

工作示例 https://jsfiddle.net/p79dpvww/