Liniuță (proprietăți padding și marja), css - Exemple

margin-top mai mare marjă de jos. elementul se deplasează în jos, este deplasată la valoarea-margine inferioară vecin
marja-top inferioară margine de jos. margin-top este ignorată







Marja de colaps între elementele părinte și copil

pentru elementul extreme bloc superior, care nu este îndepărtat din fluxul (folosind, de exemplu, float sau poziție: absolută) și al cărui părinte are o margine-top trece de la elementul interior către mamă. pentru părinți
  • valoare marja adăugată. în cazul în care pozitiv părinte și descendenții marja de marja este negativă, și vice-versa,
  • selectează cea de mai sus. Dacă atât părintele și copilul lor sau ambele negative sau ambele pozitive.

Pentru a elimina colaps, puteți merge pe revers, de exemplu, cere unitate părinte overflow: ascuns;. Există, de asemenea, o modalitate destul de bun pentru a rezolva problema.

Marja de colaps între elementele adiacente

pentru elementele adiacente din domeniul de curgere este calculat ca
  • suma-sus margine inferioară margine-superioară și elementul inferior. în cazul în care acestea sunt în direcții diferite,
  • selectează cea de mai sus. Valoarea marjei dacă ambele negative sau ambele pozitive.

Nu aveți nevoie să știu totul, suficient pentru a ști unde să se uite cum se face. Mozilla încă mă ajută. Butonul din dreapta este pur și simplu de neprețuit și salvează o mulțime de timp. Vitaly „Pentru fiecare parte a padding și marja

Principalul-interior .column-centru-interior. Principalul-interior .column-stânga interior. Principalul-interior-.column dreapta-interior padding: 0;
>





Mishechka Natasha, care rulează ambele versiuni, acum nu știu ce să aleagă. Înclin la a doua - este mai scurtă și puteți specifica padding-top în px. NMitra :) Mishechka Vă mulțumesc foarte mult! Mishechka Natalia, sa dovedit, funcționează doar pe principal. În schimb NMitra

Stiluri pentru „detalii“ link-ul:

În Conținut (vizualizare generală), adăugați codul:

sari-link-font: bold normală 11px / 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif;
>

Nu sunt sigur că e corect, funcționează. Yuri Vă rugăm să ne ajute să facă față unei situații aparent simplă. Între corp etichete div prescris de două blocuri. Ele sunt pătrate convenționale, dintre care unul este încorporat în celălalt. Stilurile pentru fiecare număr minim de proprietăți (pentru curățenia de experiment): înălțimea, lățimea și fundal. La unitatea de bază lățime: 800px; înălțime: 800px, și au o lățime bloc de copil: 600px; Înălțime: 600px. Sarcina - centrarea proprietățile care utilizează copil marjă în cadrul unității de bază (registrele de proprietate în stiluri pentru nodurile copil). Ca urmare, marja (100px pe toate laturile) va funcționa doar în stânga și în dreapta. Limita superioară a unității filiala rămâne a aderat la mamă. Nu pot să înțeleg de ce. Desigur, dacă vă înregistrați blocul padding-mamă sau copil - float, atunci totul funcționează bine. Dar, în acest caz, elementele să plutească și poziția nu este absolut necesar. Este posibil într-o astfel de situație numai prin marja propisyvniya de centrare pentru unitatea copilului? NMitra Tu prăbușește marja. Selectați cea mai potrivită variantă de mai sus, de exemplu

afișare div div: inline-block;
>

De asemenea, este posibil să se ia întregul conținut al articolului în

Apoi, selectorul și codul va #myBlock
Boom Vegan ești așa răspunde cu promptitudine! Și răspunsuri de multe ori un astfel sensibil. Vă mulțumesc foarte mult! Anonim Vă mulțumesc foarte mult! explicație excelentă a proprietăților. NMitra Vă mulțumim pentru feedback-ul dvs.! Am încercat să fac povestea interactiv IVÁN super-Duper pozitiv important ca site-ul :)