Cum să puneți css div în centru în raport cu părintele

Pentru a nu turna apa, voi arăta imediat cum se realizează acest lucru și apoi vă voi spune ce este elementul părinte sau cine dintre voi nu înțelege. Deci, întregul punct al alinierii este următorul:







  1. Presupunem divului nostru o anumită lățime (obligatorie)
  2. Defineste marjele externe - marja: 0 auto;

De exemplu, într-un container galben (îmi place tot ce-mi apar în blocurile galbene, deși) este un bloc gri. Marcajul arată astfel:

Aici, blocul #ct acționează ca părinte pentru div div. pentru că se află în ea. Corp. la rândul său, este părintele #ct. Blocul nostru gri este de 4 ori mai mic decât containerul și în mod implicit va fi apăsat în stânga sus.

Cum să puneți css div în centru în raport cu părintele






Cum o apreciem? Este simplu:

Am stabilit deja lățimea, tocmai am scris-o din nou pentru a sublinia că lățimea pentru centrare ar trebui să fie scris MUST! A doua proprietate obligatorie este marja: 0 auto. unde 0 este o indentare de sus și de jos (poți scrie altul dacă asta) și auto este doar cuvântul magic care centrează elementul pe orizontală. Să verificăm.

Cum să puneți css div în centru în raport cu părintele

Totul funcționează, am realizat sarcina, deși a fost foarte simplă. Recepția funcționează chiar dacă unitatea parentală însăși nu este dimensionată în mod explicit. De exemplu, corpul este corpul paginii și nu specificăm lățimea paginii, dar dacă #ct scrie marja: 0 auto (lățimea acestui container este deja definită), atunci ea va deveni și centrat relativ la părintele său, adică relativ la corp.

Interesant de lumea construirii site-urilor

V-ați abonat. Mulțumesc.







Articole similare

Trimiteți-le prietenilor: