Triks: sentrer en absolutt posisjon div

Noen ganger kompliserer vi livene våre med enkle ting som er mindre kompliserte enn vi tror, ​​i CSS og at når vi ser løsningen, ler vi nesten av å observere slike anekdoter.

Mer enn én person har spurt meg hvordan jeg skal sentrere en absolutt posisjonert div, og svaret er veldig enkelt:

  1. Vi gir div en fast bredde. Eksempel: 500 px
  2. Vi posisjonerer absolutt div med 50% igjen. Eksempel: posisjon: absolutt; venstre: 50%;
  3. Vi trekker halvparten av det den måler med marginen. Eksempel: margin-left: -250px;

Resultatet er en perfekt sentrert, absolutt posisjonert div.


Legg igjen kommentaren

Din e-postadresse vil ikke bli publisert. Obligatoriske felt er merket med *

*

*

  1. Ansvarlig for dataene: Miguel Ángel Gatón
  2. Formålet med dataene: Kontroller SPAM, kommentaradministrasjon.
  3. Legitimering: Ditt samtykke
  4. Kommunikasjon av dataene: Dataene vil ikke bli kommunisert til tredjeparter bortsett fra ved juridisk forpliktelse.
  5. Datalagring: Database vert for Occentus Networks (EU)
  6. Rettigheter: Når som helst kan du begrense, gjenopprette og slette informasjonen din.

  1.   Ivan Lira sa

    Tusen takk .. som du sier noe så enkelt, og som til tross for tiden er fremdeles forfatter av mange hodepine.
    Innlegget ditt var veldig nyttig for meg, tusen takk.

  2.   pod sa

    Tusen takk !!!

  3.   glbroman sa

    Godt bidrag det tjente meg mye, takk

  4.   LUCASG sa

    For en galning han serverte meg: D

  5.   victor sa

    Utmerket takk ...

  6.   Benjamin sa

    Veldig bra Carlos.

  7.   Mario Lozano plassholderbilde sa

    utmerket info

  8.   Frank Koq sa

    Takk, det tjente meg

  9.   marc sa

    Du reddet meg!!! Takk skal du ha :)

  10.   Danielfloyd sa

    Takk onkel, du hjalp meg mye !!, den manglende fantasien til meg.

  11.   Damian sa

    tusen takk !!!!! dette trikset hjelper meg alltid haha

  12.   o sa

    tusen takk utmerket venn

  13.   Chrismart Anji sa

    Dette er ikke sentrert, alt avhenger av den opprinnelige størrelsen på basediv-elementet som vi får det til å vokse til, avhengig av hva som er plassert inne, for meg var det mer nyttig å bruke dette enn visuelt hvis jeg ser det enda mer sentrert og reponsivt :

    absolutt;
    venstre: 50%;
    margin til venstre: -100px;

    det ville være halvparten.

  14.   Edgar cjuno sa

    Bidraget blir satt pris på, det hjalp meg virkelig, hilsen!

  15.   Miriam Jess sa

    Veldig bra bidrag hjalp meg mye, tusen nåde!