https://jsfiddle.net/ze5k4cqb/ Bagaimana saya bisa mengganti bagian tengah halaman dengan gambar di mana garis tabel menutupinya? Itu bisa dilakukan tanpa pertanyaan media? Dengan kueri media, jadi dengan persentase untuk margin, seperti ini

        -webkit-margin-end: -15%;
        -webkit-margin-before: -6%;
        left: 40%;
        top: 40%;
        right: 40%;

Gagal dengan pengaturan resolusi yang berbeda. Adakah trik untuk melakukannya tanpa 3000 baris kueri media?

0
simone_meh 19 September 2019, 20:39

1 menjawab

Jawaban Terbaik

Animasi keren saat melayang. Yang bisa saya katakan adalah bahwa transform: translate adalah teman Anda. Anda memiliki margin negatif yang aneh, jadi saya harus memperhitungkannya dengan fungsi kalk dalam terjemahan.

Saya juga menambahkan pointer-events: none sehingga Anda dapat memicu animasi kuadran bahkan jika Anda mengarahkan kursor ke .logo-div.

#container {
  position: relative;
}

.logo-div {
  left: 50%;
  top: 50%;
  width: 30%;
  transform: translate(calc(-50% - 15px), -50%);
  position: absolute;
  z-index: 100;
  display: flex;
  pointer-events: none;
}
0
Rickard Elimää 20 September 2019, 07:45