我在 Internet Explorer 8 下选中/取消选中复选框时遇到问题。
当我选中一个复选框时，它会垂直“移动”，然后当我取消选中它时它会返回到原来的位置。 我试着用 margin 和 vertical-align 来解决这个问题，但没有成功。
代码在 Firefox 和 Chrome 中完美运行。
页面:
<?xml version="1.0" encoding="UTF-8" ?>
<ui:composition template="../templates/ui-test.xhtml"
xmlns="http://www.w3.org/1999/xhtml" xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html" xmlns:p="http://primefaces.org/ui"
xmlns:nttdata="http://nttdata.com/facelets" lang="it-IT">
<ui:define name="title">Test Checkbox</ui:define>
<ui:define name="head"></ui:define>
<ui:define name="navbar"></ui:define>
<ui:define name="content">
<div id="contentCc">
<h:outputText value="Selection: " />
<p:selectBooleanCheckbox value="#{testViewBean.selectedValue}" />
</div>
</ui:define>
</ui:composition>
模板:
<?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">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html" xmlns:p="http://primefaces.org/ui"
lang="it-IT">
<f:view contentType="text/html" locale="it_IT">
<h:head>
<f:facet name="first">
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv='Cache-control' content='no-cache, no-store, must-revalidate' />
<meta http-equiv='Expires' content='0' />
<meta http-equiv='Pragma' content='no-cache' />
<title>
<ui:insert name="title">Default title</ui:insert>
</title>
</f:facet>
<ui:insert name="head"></ui:insert>
</h:head>
<h:body>
<div id="outer">
<div id="header" class="ui-widget ui-widget-header ui-corner-all">
<ui:insert name="navbar">
<ui:include
src="#{pageContext.request.contextPath}/components/navbar/navbar.xhtml" />
</ui:insert>
</div> <!-- header -->
<div id="content">
<ui:insert name="content">Default Content</ui:insert>
</div>
<div id="footer">
<!--ui:insert name="footer"></ui:insert-->
</div>
</div> <!-- outer -->
</h:body>
</f:view>
</html>
生成的 XHTML 代码是有效的(通过 validator.w3.org 验证)，但在 ie8 下，单击时输入元素“跳舞”。下面是ie8下checked和uncheckbox的图片:
https://dl.dropboxusercontent.com/u/7865852/ie8_checkbox_unchecked.png https://dl.dropboxusercontent.com/u/7865852/ie8_checkbox_checked.png
使用 h:selectBooleanCheckbox 而不是 p:selectBooleanCheckbox 在 ie8 下工作，但我丢失了应用的所有(框架默认)css 样式。
最佳答案
我有同样的问题，但所有浏览器(primefaces 5.1) 我在复选框元素上用 css 修复了它
display: block;
float: left;
关于css - 跨浏览器的 Primefaces 复选框一致性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21556514/