Page 1 of 1
SelectBox in topbar
Posted: 12 Aug 2016, 13:34
by UlrichC
HI altogether,
I have a little problem with a "p:selectOneMenu" in the topbar. Functionally, it works, but it is displayed a bit strang. If I hover over the down-arrow of the selectonemenu, the right half of the "square with the arrow" gets the color of the background, and the left halb of this square gets a bit grey (background of the selectonemenu is white).
Even with z-index:10 or above, nothing changed.
Did you have any idea, how this can be solved?
Thanks you very much in advance,
Ulrich
Re: SelectBox in topbar
Posted: 16 Aug 2016, 13:09
by mert.sincan
Please try;
Code: Select all
<p:selectOneMenu style="background-color: white" .../>
Re: SelectBox in topbar
Posted: 20 Aug 2016, 09:58
by UlrichC
I tried that already, but nothing changed.. I also tried z-index, but this does not have any effect either...
Re: SelectBox in topbar
Posted: 20 Aug 2016, 20:32
by wahuu
Similar issue with basic SelectOneMenu.
Re: SelectBox in topbar
Posted: 23 Aug 2016, 11:17
by mert.sincan
Hi UlrichC,
Can you please attach a sample topbar.xhtml for us to replicate?
Hi Wahuu,
I couldn't replicate it. Can you please a sample xhtml page? And which theme and PF version are you using?
Re: SelectBox in topbar
Posted: 28 Aug 2016, 12:42
by wahuu
Hi aragorn,
Currently i'm using primefaces version 6.0 and delta theme 1.0.10. But i also tried bootstrap and no change.
Here is my sample xhtml file:
Code: Select all
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="/templates/common-template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<ui:define name="content">
<h1>Settings</h1>
<p:selectOneMenu id="value" value="#{settingsForm.value}"
style="width:125px">
<f:selectItem itemLabel="Select One" itemValue="" />
<f:selectItem itemLabel="Xbox One" itemValue="Xbox One" />
<f:selectItem itemLabel="PS4" itemValue="PS4" />
<f:selectItem itemLabel="Wii U" itemValue="Wii U" />
</p:selectOneMenu>
</ui:define>
</ui:composition>
Re: SelectBox in topbar
Posted: 08 Sep 2016, 14:34
by mert.sincan
There are two solutions;
Code: Select all
<style type="text/css">
.ui-selectonemenu .ui-selectonemenu-trigger {
padding: 0 6px;
}
.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon {
margin-top: 5px;
}
</style>
OR
Code: Select all
<style type="text/css">
.ui-widget {
font-size: 90%;
}
</style>