html - <h :commandLink> and <h:commandButton> for same style 之间的 CSS 问题

Question

在我的示例应用程序中，JSF 页面底部有 3 个操作按钮，它由 2 个命令按钮和一个命令链接设计。问题是我为这 3 个提供了相同的样式类，但命令按钮在单行中正确显示，但命令链接不在同一行中。

此页面中的示例 A 是作者，B,c 是作者

-----------------------------------------
|                                        |
|                                        |
|                                        |  
|                                        |
|                        ----- -----     |
|                 -----  | B | | c |     |
|                 | A |  ----- -----     |   
|                 -----                  |
-----------------------------------------

我需要在同一行中显示。这些按钮的样式类是。

.ButtonStyle{
    border: 1px solid #999;
    padding:1px 4px 1px 4px;
    color: #333;
    background-color: #e7e7e7;
    text-decoration: none;
    margin-right: 10px;
    display: inline;
    cursor:pointer;
}

这 3 个的编码是:

<div align="right'>
 <h:commandLink id="" action=".."  value="A" styleClass="ButtonStyle"/> 
 <h:commandButton id="" action=".."  value="B" styleClass="ButtonStyle"/>
 <h:commandButton id="" action=".."  value="C" styleClass="ButtonStyle"/>
</div>

我发现的问题在<h:commandlink>样式与 <h:commandbutton> 不匹配.

谁能帮我解决这个问题？

Answer 1

试试这个(我有点猜是因为我不熟悉 JSF):

.ButtonStyle {
    vertical-align: top
}

默认的 vertical-align 是 baseline，它看起来像您的 ASCII 艺术。