Thủ thuật: căn giữa một div vị trí tuyệt đối

Trong CSS, đôi khi chúng ta phức tạp hóa cuộc sống của mình bằng những thứ đơn giản ít phức tạp hơn chúng ta nghĩ, và rằng khi chúng tôi nhìn thấy giải pháp, chúng tôi gần như bật cười khi quan sát những giai thoại như vậy.

Nhiều người đã hỏi tôi cách căn giữa một div được định vị tuyệt đối và câu trả lời rất đơn giản:

  1. Chúng tôi cung cấp cho div một chiều rộng cố định. Ví dụ: 500px
  2. Chúng tôi hoàn toàn định vị div với 50% còn lại. Ví dụ: vị trí: tuyệt đối; trái: 50%;
  3. Chúng tôi trừ đi một nửa giá trị mà nó đo được với lợi nhuận. Ví dụ: margin-left: -250px;

Kết quả là một div hoàn toàn chính giữa, vị trí tuyệt đối.


Để lại bình luận của bạn

địa chỉ email của bạn sẽ không được công bố. Các trường bắt buộc được đánh dấu bằng *

*

*

  1. Chịu trách nhiệm về dữ liệu: Miguel Ángel Gatón
  2. Mục đích của dữ liệu: Kiểm soát SPAM, quản lý bình luận.
  3. Hợp pháp: Sự đồng ý của bạn
  4. Truyền thông dữ liệu: Dữ liệu sẽ không được thông báo cho các bên thứ ba trừ khi có nghĩa vụ pháp lý.
  5. Lưu trữ dữ liệu: Cơ sở dữ liệu do Occentus Networks (EU) lưu trữ
  6. Quyền: Bất cứ lúc nào bạn có thể giới hạn, khôi phục và xóa thông tin của mình.

  1.   Ivan Lira dijo

    Cảm ơn bạn rất nhiều .. như bạn nói một điều rất đơn giản và rằng mặc dù thời gian trôi qua vẫn là tác giả của nhiều đau đầu.
    Bài viết của bạn rất hữu ích đối với tôi, cảm ơn bạn rất nhiều.

  2.   vỏ quả dijo

    Cảm ơn rât nhiều !!!

  3.   glbroman dijo

    Đóng góp tốt đã giúp tôi rất nhiều, cảm ơn

  4.   LUCASG dijo

    Anh ấy phục vụ tôi thật là điên rồ: D

  5.   kẻ thắng cuộc dijo

    Cảm ơn vô cùng…

  6.   cây bồ đề dijo

    Carlos rất tốt.

  7.   Hình ảnh trình giữ chỗ Mario Lozano dijo

    thông tin tuyệt vời

  8.   Frank Koq dijo

    Cảm ơn bạn, nó đã phục vụ tôi

  9.   marc dijo

    Bạn đã cứu tôi!!! Cảm ơn bạn :)

  10.   Danielfloyd dijo

    Cảm ơn cô chú, nó đã giúp tôi rất nhiều !!, sự thiếu tưởng tượng đó của tôi.

  11.   Damian dijo

    Cảm ơn rât nhiều !!!!! thủ thuật này luôn giúp tôi haha

  12.   o dijo

    cảm ơn bạn rất nhiều người bạn xuất sắc

  13.   Chrissmart Anji dijo

    Điều này không được căn giữa, tất cả phụ thuộc vào kích thước ban đầu của phần tử div cơ sở mà chúng tôi làm cho nó phát triển tùy thuộc vào những gì được đặt bên trong nó, đối với tôi, sử dụng nó sẽ hữu ích hơn so với trực quan nếu tôi thấy nó thậm chí còn được căn giữa và trả lời:

    tuyệt đối;
    trái: 50%;
    lề trái: -100px;

    đó sẽ là một nửa.

  14.   Edgar cjuno dijo

    Sự đóng góp được đánh giá cao, nó thực sự đã giúp tôi, lời chào!

  15.   Miriam Jess dijo

    Đóng góp rất tốt đã giúp tôi rất nhiều, một ngàn ân huệ!