parentDiv {

Eroarea spațiului alb poate fi o problemă mare pentru designerii web.

Pasul 1

Analizați setarea marjei pentru fiecare problemă Div. Asigurați-vă că divizii de pe fiecare parte a spațiului gol nu au o setare a marjei care creează spațiul gol. Marja fiecărui Div este în afara zonei. Dacă a ta are o marjă, atunci culoarea de fundal sau imaginea părintelui Div poate fi afișată pe margine și ar putea crea efectul spațiului alb. Rezoluția este la fel de simplă ca stabilirea marjei Divs cu probleme la zero.

Pasul 2

Definește marginea și setările de spațiu pentru toate elementele de bloc. Diferitele browsere aplică diferite opțiuni de marjă și distanțe prestabilite în toate elementele de bloc. Marginea unuia dintre aceste elemente bloc poate fi responsabilă de efectul unui spațiu alb nedorit într-un browser, având în același timp un efect diferit într-un alt browser. Prin standardizarea proprietăților distanței și marjei în browsere puteți elimina în siguranță acest lucru.

Un set de reguli CSS pentru a efectua standardizarea configurației elementelor bloc poate apărea după cum urmează:

html, organism {margine: 0; padding: 0;} p {margine 0 0 3px 0; umplutura: 0;} h1, h2, h3, h4, h5, h6 {marja 0 0 2px 0; padding: 0;} forma {marginea 0; padding: 0;}

Pasul 3

Plasați conținutul în Div dvs. Este posibil ca unele browsere să nu afișeze un Div care nu are conținut, chiar dacă are o imagine de fundal. Dacă dvs. nu aveți conținut, browserul îl poate reduce lăsând un spațiu mic. Pentru a rezolva acest lucru, luați în considerare introducerea unui fișier GIF transparent în Div, care vă va oferi conținut care va fi recunoscut de browser fără a modifica impresia vizuală pe care doriți să o creați.

Pasul 4

Nest Divs în elementul părinte Div. Atribuiți un părinte div sau un ambalaj care păstrează cele două divuri care provoacă problema. Puneți o culoare de fundal pentru elementul părinte pentru a obține o culoare sau o imagine mai dezirabilă care să acopere spațiul alb și să se potrivească designului site-ului.

Pasul 5

Verificați proprietățile de aliniere. Divicii care au configurația de aliniere "inline" (inline) pot tendința să adauge pixeli în partea superioară și inferioară a Div pentru a crea modificări de text, deoarece parametrul de aliniere "inline" este adesea folosit pentru alinierea textului. În loc să încercați să îmbinați cele două Divs folosind strategia de aliniere "inline", pur și simplu re-aliniați alinierea în "Block" și plasați Divs folosind proprietatea de plasare "float". Iată un exemplu:

parentDiv {

display: bloc;}

childDiv1 {

float: stânga;}

childDiv2 {

float: stânga;}