p:selectBooleanCheckbox UI-Issue with Babylon

Post Reply
christophs78
Posts: 64
Joined: 01 Mar 2018, 12:29

25 Jul 2019, 09:15

Code: Select all

<h:form>
		<p>
			<p:selectBooleanCheckbox id="checkbox4"/>
			<p:outputLabel for="checkbox4" value="die vierte Checkbox"/>
			
			<p:selectBooleanCheckbox id="checkbox5"/>
			<p:outputLabel for="checkbox5" value="die fünfte Checkbox"/>
		</p>

		<p>
			<p:selectBooleanCheckbox itemLabel="die erste Checkbox" />
			<p:selectBooleanCheckbox itemLabel="die zweite Checkbox" />
			<p:selectBooleanCheckbox itemLabel="die dritte Checkbox" />
		</p>	
</h:form>
Babylon:
Image

Nova-Light:
Image

Babylon-CSS:

Code: Select all

body .ui-chkbox {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    width: 20px;
    height: 20px;
}
Nova-Light-CSS:

Code: Select all

body .ui-chkbox {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    height: 20px;
}
Babylon defines width for .ui-chkbox. So the work-around is to define the following CSS within the project.

Code: Select all

/* Fix für p:selectBooleanCheckbox */
body .ui-chkbox {
	width: auto;
}

mert.sincan
Posts: 4638
Joined: 29 Jun 2013, 12:38

29 Jul 2019, 10:13

Thanks a lot! Fixed now.

Best Regards,

Post Reply

Return to “Babylon - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest