Krok 1

Przeanalizuj ustawienie marginesu dla każdego problematycznego Div. Upewnij się, że elementy DIV po każdej stronie pustego obszaru nie mają ustawienia marginesów, które tworzy puste miejsce. Margines każdego Div znajduje się w obszarze poza nim. Jeśli twój ma margines, to kolor tła lub obraz div rodzicielskiej może być wyświetlany na marginesie i może stworzyć efekt białej przestrzeni. Rozdzielczość jest tak prosta, jak ustawienie marginesu DIV z problemami na zero.

Krok 2

Definiuje równomiernie ustawienia marginesów i odstępów dla wszystkich elementów bloku. Różne przeglądarki stosują różne opcje marginesu i ustalonego odstępu we wszystkich elementach bloku. Margines jednego z tych elementów blokowych może być odpowiedzialny za efekt niechcianej białej przestrzeni w przeglądarce, mając jednocześnie inny efekt w innej przeglądarce. Poprzez standaryzację właściwości odstępów i marginesów w przeglądarkach można to bezpiecznie wyeliminować.

Zestaw reguł CSS do przeprowadzenia standaryzacji konfiguracji elementu blokowego może wyglądać następująco:

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

Krok 3

Umieść zawartość w Div. Niektóre przeglądarki mogą nie wyświetlać Div, która nie ma treści, nawet jeśli ma obraz tła. Jeśli twoja nie ma zawartości, przeglądarka może ją zmniejszyć, pozostawiając małą pustą przestrzeń. Aby rozwiązać ten problem, rozważ wstawienie przezroczystego pliku GIF do Div. Daje to zawartość, która zostanie rozpoznana przez przeglądarkę bez modyfikowania wizualnego wrażenia, które chcesz utworzyć.

Krok 4

Zagnieżdżaj Divy w rodzimym elemencie Div. Przydziel rodzic Div lub zawijanie, które utrzymuje dwóch Div, które powodują problem. Umieść kolor tła w elemencie nadrzędnym, aby uzyskać bardziej pożądany kolor lub obraz, który pokryje białą przestrzeń i dopasuje projekt witryny.

Krok 5

Sprawdź właściwości linii trasowania. Divy, które mają konfigurację wyrównania "inline" (inline) mogą mieć tendencję do dodawania pikseli u góry i dołu Div, aby tworzyć modyfikacje tekstu, ponieważ parametr "line inline" jest często używany do wyrównania tekstu. Zamiast próbować scalić dwa elementy DIV za pomocą strategii wyrównania "w linii", po prostu ponownie przypisz wyrównanie w "Zablokuj" i umieść elementy DIV za pomocą właściwości umieszczania "ruch". Oto przykład:

parentDiv {

display: block;}

childDiv1 {

float: left;}

childDiv2 {

float: left;}