Primefaces tabview语言菜单

-1

Im有一个Primefaces简单语言菜单的问题。它是由两个元素组成的选项卡。英语和西班牙语。Primefaces tabview语言菜单

我遇到的问题是，当标志出现时，标志旁边会出现巨大的空白。

The white space on the right side of the flags

我看到的代码没有问题。我想知道是否有人知道如何解决它。

代码：

<ul> 
<h:form> 
<li> 
<h:commandButton action="#{localeBean.changeLanguage('en')}" value="English" image="/resources/modena-layout/images/us.png" />       
</li> 

<li> 
<h:commandButton action="#{localeBean.changeLanguage('es')}" value="Spanish" image="/resources/modena-layout/images/es.png" /> 
</li> 
</h:form> 
</ul>

来源

2016-08-24 Lea

请提供版本信息。你用浏览器开发工具检查了输出吗？您是否尝试过其他浏览器？ – irieill

我在代码中看不到任何Primefaces用法... – peterremec

@peterremec对不起，说我在使用primefaces，但此刻我不知道我的问题是另一个主题。我认为这是一个primefaces问题。 – Lea

相反commonButton的，也许你应该尝试这样的事：

<p:commandLink action="#{localeBean.changeLanguage('en')}" 
    <div id="englishFlag" class="englishFlagClass" /> 
</p:commandLink>

CSS：

.englishFlagClass { 
    width: 24px; 
    height: 24px; 
    background: url("../url_to/englishFlag.png") no-repeat center; 
    background-size: 100%; 
    margin-left: auto; 
    margin-right: auto; 
    display: inline-block; 
}

这样的图像实际上是一个链接，但看起来像一个按钮。然后，您可以根据需要设置与CSS的链接。也许一些CSS属性在你的情况下是多余的（我只是复制了一些样本），但这是一个开始。

来源

2016-08-24 07:39:33 peterremec

我结束了使用CSS来安排个别面板。

像这样：

element.style { 
    width: 22px; 
    margin: 10px; 
    padding: 3px; 
}

来源

2017-01-16 22:55:37 Lea

Primefaces tabview语言菜单

回答

相关问题