Trick: zentriere eine absolute Position div

In CSS komplizieren wir manchmal unser Leben mit einfachen Dingen, die weniger kompliziert sind als wir denken. und wenn wir die Lösung sehen, lachen wir fast darüber, solche Anekdoten zu beobachten.

Mehr als eine Person hat mich gefragt, wie man ein absolut positioniertes Div zentriert, und die Antwort ist sehr einfach:

  1. Wir geben dem Div eine feste Breite. Beispiel: 500px
  2. Wir positionieren die Div absolut mit 50% übrig. Beispiel: Position: absolut; links: 50%;
  3. Wir subtrahieren die Hälfte dessen, was es misst, mit der Marge. Beispiel: Rand links: -250px;

Das Ergebnis ist ein perfekt zentriertes, absolut positioniertes Div.


Der Inhalt des Artikels entspricht unseren Grundsätzen von redaktionelle Ethik. Um einen Fehler zu melden, klicken Sie auf hier.

15 Kommentare, hinterlasse deine

Hinterlasse einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht.

*

*

  1. Verantwortlich für die Daten: Miguel Ángel Gatón
  2. Zweck der Daten: Kontrolle von SPAM, Kommentarverwaltung.
  3. Legitimation: Ihre Zustimmung
  4. Übermittlung der Daten: Die Daten werden nur durch gesetzliche Verpflichtung an Dritte weitergegeben.
  5. Datenspeicherung: Von Occentus Networks (EU) gehostete Datenbank
  6. Rechte: Sie können Ihre Informationen jederzeit einschränken, wiederherstellen und löschen.

  1.   Ivan Lira sagte

    Vielen Dank .. wie Sie etwas so Einfaches sagen und das trotz der Zeit immer noch der Autor vieler Kopfschmerzen ist.
    Ihr Beitrag war sehr nützlich für mich, vielen Dank.

  2.   Cob sagte

    Vielen Dank !!!

  3.   Glbroman sagte

    Guter Beitrag hat mir sehr geholfen, danke

  4.   LUCASG sagte

    Was für ein großer Wahnsinn er mir gedient hat: D.

  5.   Sieger sagte

    Großartig, danke…

  6.   Benjamin sagte

    Sehr guter Carlos.

  7.   Mario Lozano sagte

    Ausgezeichnete info

  8.   Frank Koq sagte

    Danke, es hat mir gedient

  9.   marc sagte

    Du hast mich gerettet!!! Danke :)

  10.   Danielfloyd sagte

    Danke Onkel, du hast mir sehr geholfen !!, dieser Mangel an Vorstellungskraft von mir.

  11.   damian sagte

    vielen Dank !!!!! Dieser Trick hilft mir immer haha

  12.   o sagte

    Vielen Dank, sehr guter Freund

  13.   Chrismart Anji sagte

    Dies ist nicht zentriert, es hängt alles von der ursprünglichen Größe des Basis-Div-Elements ab, auf das wir es wachsen lassen, je nachdem, was sich darin befindet. Für mich war es nützlicher, dies zu verwenden als visuell, wenn ich es noch zentrierter und reaktionsfähiger sehe ::

    absolut;
    links: 50%;
    Rand links: -100px;

    das wäre die Hälfte.

  14.   Edgar cjuno sagte

    Der Beitrag wird geschätzt, es hat mir sehr geholfen, Grüße!

  15.   Miriam Jess sagte

    Sehr guter Beitrag hat mir sehr geholfen, tausend Gnade!