Problema de CSS - JSF & Facelets

Opa :smiley:

To usando JSF com Facelets e tenho alguns comandos css:

body {
	background: #c8cfd4;
}

E ele não está pegando a tela inteira, ele pega só a parte do div e deixa o resto de lado e fica sobrando umas bordas brancas nele.
My layout está da seguinte maneira:

<?xml version="1.0" encoding="ISO-8859-1"?>
<!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:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">
	<head>
		<link href="/DP/css/estilos.css" rel="stylesheet" type="text/css" />
		<script language="javascript" type="text/javascript" src="/DP/script/script.js"></script>
	</head>
	<body>
	<div id="geral" style="border-color: black" align="center">
			<h:graphicImage url="/imagens/logo_teste.jpg" />
			<br/>
			<div>
				<ui:insert name="cabecalho"></ui:insert>
			</div>
			<br/>
			<ui:include src="/portal/menu/menu.xhtml" />
			<div>
				<br/>
				<f:subview id="cabecalhoEmpresa"
					rendered="#{empresa.cabecalhoEmpresa}">
					<table width="750px;" align="center">
						<tr>
							<td class="fonteLabel">Empresa:</td>
							<td><h:outputText styleClass="fonteLabel"
								value="#{empresa.funcionarioBean.empresa.razaoSocial}" /></td>
						</tr>
						<tr>
							<td class="fonteLabel" width="8%">CPNJ:</td>
							<td><h:outputText styleClass="fonteLabel"
								value="#{empresa.funcionarioBean.empresa.CNPJ}" /></td>
						</tr>
						<tr>
							<td colspan="2">&nbsp;</td>
						</tr>
						<tr>
							<td class="fonteLabel" >Usuário:</td>
							<td><h:outputText styleClass="fonteLabel"
								value="#{empresa.funcionarioBean.login.usuario}" /></td>
						</tr>
					</table>
				</f:subview>
			</div>
			
            <div id="topo">
                <ui:insert name="topo"></ui:insert>               
            </div>

            <div id="esquerda">
                <ui:insert name="esquerda"></ui:insert>
            </div>

            <div id="conteudo">
                <ui:insert name="conteudo"></ui:insert>
            </div>

			<div>
				<br/>
				<h:messages styleClass="mensagensErro" />
			</div>

            <div id="direita">
                  <ui:insert name="direita"></ui:insert>
            </div>

            <div id="rodape">
                <ui:insert name="rodape"></ui:insert>
            </div>
	</div>
	</body>
</html>

        

Alguém sabe o que estou fazendo de errado?

se essa classe é aplicado ao seu vc pode resolver o problema assim:


.body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: cor;
}

assim vc zera suas margens(margin-x) e retira o espaço em branco.

espero que resolva.

[]s,

Provavelmente você ainda não conseguiu, e o erro só ocorre no firefox! certo?

Tive o mesmo problema com um layout q funcionava perfeitamente quando criei com xhtml/css
Foi só colocar no facelets que começou o erro.

Consegui resolver fazendo o seguinte:

html {
	height: 100%;
	overflow: auto;
}

aqui funciona perfeitamente com firefox 3 e tudo mais.

body {
    background: transparent url("../images/bg.jpg") center repeat-y fixed;
    height: auto;
}

no meu caso uso uma imagem com fundo.