對於相同風格的<h：commandLink>和<h：commandButton>之間的CSS問題

在我的示例應用程序中，JSF頁面底部有3個操作按鈕，它由2個命令按鈕和一個命令鏈接設計。問題是我給了這三個相同的風格類，但命令按鈕在單行中正確顯示，但命令鏈接不在同一行中。對於相同風格的<h：commandLink>和<h：commandButton>之間的CSS問題

實施例在當前頁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>匹配的問題。

任何人都可以幫助我出來嗎？

來源

2011-09-08 Jagan

獲取螢火蟲並嘗試分析其容器元素的CSS。您的鏈接和按鈕可能會從其他css定義繼承。

來源

2011-09-08 11:48:04

是的，謝謝你，你是正確的，其實我早就用螢火蟲試過了，只有我才知道這個問題。 – Jagan

試試這個（我猜了一下，因爲我不familar與JSF）：

.ButtonStyle { 
    vertical-align: top 
}

默認vertical-align爲baseline，這看起來像你的ASCII藝術。

來源

2011-09-08 11:47:29 thirtydot

好的，我試過這個，它幾乎可以工作，期待什麼，謝謝你的夥伴 – Jagan

有什麼特別的原因你把[接受的答案]（http://meta.stackexchange.com/a/5235/155050）改成了不同的？ – thirtydot

對於相同風格的<h：commandLink>和<h：commandButton>之間的CSS問題

回答

相關問題