Passo 1

Analise a configuração de margem para cada Div problemática. Certifique-se de que os Divs em cada lado do espaço em branco não tenham uma configuração de margem que esteja criando o espaço em branco. A margem de cada Div está na área fora dela. Se o seu tiver uma margem, a cor ou a imagem de fundo do Div pai poderá ser exibida na margem e poderá criar o efeito de espaço em branco. A resolução é tão simples quanto definir a margem do Divs com problemas no zero.

Passo 2

Define as configurações de margem e espaçamento uniformemente para todos os elementos de bloco. Os diferentes navegadores aplicam diferentes opções de margem e espaçamento predeterminado em todos os elementos de bloco. A margem de um desses elementos de bloco pode ser responsável pelo efeito de espaço em branco indesejado em um navegador, embora tenha um efeito diferente em outro navegador. Ao padronizar as propriedades de espaçamento e margem nos navegadores, você pode eliminar isso com segurança.

Um conjunto de regras CSS para executar a padronização da configuração do elemento de bloco pode aparecer da seguinte maneira:

html, body {margin: 0; preenchimento: 0;} p {margin 0 0 3px 0; preenchimento: 0;} h1, h2, h3, h4, h5, h6 {margem 0 0 2px 0; preenchimento: 0;} form {margin 0; padding: 0;}

Passo 3

Coloque o conteúdo na sua Div. Alguns navegadores podem não mostrar uma Div que não tenha conteúdo, mesmo que tenha uma imagem de fundo. Se o seu não tiver conteúdo, o navegador pode reduzi-lo deixando um pequeno espaço em branco. Para resolver isso, considere a inserção de um arquivo GIF transparente no Div. Isso fornecerá conteúdo, que será reconhecido pelo navegador sem modificar a impressão visual que você deseja criar.

Passo 4

Aninhe as Divs dentro do elemento div pai. Atribua um div ou wrap pai que mantenha os dois Divs que causam o problema. Coloque uma cor de plano de fundo no elemento pai para obter uma cor ou imagem mais desejável que cubra o espaço em branco e ajuste o design do site.

Passo 5

Verifique as propriedades de alinhamento. As divs que possuem a configuração de alinhamento "inline" (inline) tendem a adicionar pixels nas partes superior e inferior do Div para criar modificações de texto, pois o parâmetro de alinhamento "inline" é geralmente usado para alinhamento de texto. Em vez de tentar mesclar os dois Divs usando a estratégia de alinhamento "inline", simplesmente reatribua o alinhamento em "Block" e coloque os Divs usando a propriedade de posicionamento "float". Aqui está um exemplo:

parentDiv {

display: bloco;}

childDiv1 {

float: left;}

childDiv2 {

float: left;}